/* --- style.css --- */
/* ==========================================================================
   THE INDIA BIENNALE ’26 — style.css
   Palette: #FFF7E9 cream · #FA207F pink · #730C39 maroon
   ========================================================================== */

/* ---------- Fonts ---------- */
/* Season Mix-TRIAL is a licensed trial font. Drop the files into assets/fonts/
   and they are picked up automatically. Until then Fraunces (a close, open-source
   high-contrast serif) is used as the fallback. */
@font-face {
  font-family: "Season Mix-TRIAL";
  src: local("Season Mix-TRIAL"), local("SeasonMix-TRIAL"),
    url("../assets/fonts/SeasonMix-TRIAL.woff2") format("woff2"),
    url("../assets/fonts/SeasonMix-TRIAL.woff") format("woff");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Season Mix-TRIAL";
  src: local("Season Mix-TRIAL Italic"), local("SeasonMix-TRIAL-Italic"),
    url("../assets/fonts/SeasonMix-TRIAL-Italic.woff2") format("woff2");
  font-weight: 300 700;
  font-style: italic;
  font-display: swap;
}

/* ---------- Tokens ---------- */
:root {
  --cream: #FFF7E9;
  --pink: #FA207F;
  --maroon: #C40E5D;

  --bg: var(--cream);
  --ink: #1a0a10;
  /* derived near-black for body legibility */
  --ink-soft: #4a3a40;
  /* derived neutral for paragraphs */
  --accent: var(--pink);
  --deep: var(--maroon);
  --line: rgba(115, 12, 57, 0.16);
  --tint: #FDE6E4;
  /* derived light pink for active rows */
  --dot: #FFF0EC;

  --font-display: "Season Mix-TRIAL", "Fraunces", "Cormorant Garamond", Georgia, serif;
  --font-ui: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", sans-serif;

  --scale: 1;
  /* text size multiplier (A+/A−) */
  --ls: 0em;
  --ws: 0em;
  --lh-body: 1.6;

  --gutter: clamp(20px, 5.2vw, 100px);
  --bar-h: 34px;
  --head-h: 122px;

  --ease: cubic-bezier(.22, .61, .36, 1);
  --slow: 900ms;
}

[data-theme="dark"] {
  --bg: #16120E;
  --ink: #FFF1DC;
  --ink-soft: #E8D3C6;
  --accent: #FF5A9F;
  /* lightened pink for contrast on dark */
  --deep: #FFF7E9;
  --line: rgba(255, 247, 233, 0.2);
  --tint: #2e0a1b;
  --dot: #FFF7E9;
}

/* ---------- Base ---------- */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-size: calc(100% * var(--scale));
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--bar-h) + 90px);
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: 1rem;
  line-height: var(--lh-body);
  letter-spacing: var(--ls);
  word-spacing: var(--ws);
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  transition: background-color .5s var(--ease), color .5s var(--ease);
}

html.spacing {
  --ls: 0.06em;
  --ws: 0.16em;
  --lh-body: 1.95;
}

img,
svg {
  display: block;
  max-width: 100%;
}

img {
  height: auto;
}

h1,
h2,
h3,
p,
ul,
ol,
figure {
  margin: 0;
  padding: 0;
}

ul,
ol {
  list-style: none;
}

a {
  color: inherit;
}

button {
  font: inherit;
  color: inherit;
  cursor: pointer;
  background: none;
  border: 0;
}

main:focus {
  outline: none;
}

.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---------- Focus ---------- */
:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
  border-radius: 2px;
}

.site-footer :focus-visible,
.menu-overlay :focus-visible {
  outline-color: #fff;
}

/* ---------- Skip link ---------- */
.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1000;
  padding: 12px 20px;
  background: var(--maroon);
  color: var(--cream);
  font-weight: 600;
  text-decoration: none;
  transform: translateY(-200%);
  transition: transform .25s var(--ease);
}

.agtebtnclas {
  text-align: center;
}

.skip-link:focus {
  transform: translateY(0);
}

/* ---------- Accessibility bar ---------- */
.a11y-bar {
  /* Sticky on every device; the site header sticks right below it. */
  position: sticky;
  top: 0;
  z-index: 60;
  height: var(--bar-h);
  /* background: var(--maroon); */
  color: var(--cream);
  font-size: .78rem;
 background: #0f0208;
}

[data-theme="dark"] .a11y-bar {
  background: #0f0208;
  border-bottom: 1px solid var(--line);
}

.a11y-bar__inner {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-inline: var(--gutter);
  max-width: 2000px;
  margin-inline: auto;
}

.a11y-bar__skip {
  color: var(--cream);
  text-decoration: none;
  letter-spacing: .04em;
  border-bottom: 1px solid rgba(255, 247, 233, .4);
  white-space: nowrap;
}

.a11y-bar__skip:hover {
  border-color: var(--cream);
}

.a11y-bar__skip:focus-visible {
  outline-color: #fff;
}

.a11y-bar__tools {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-left: auto;
}

.a11y-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  min-width: 34px;
  padding: 0 10px;
  justify-content: center;
  color: var(--cream);
  font-size: .8rem;
  font-weight: 500;
  letter-spacing: .02em;
  transition: background-color .25s var(--ease), color .25s var(--ease);
}

.a11y-btn sup {
  font-size: .65em;
  margin-left: 1px;
}

.a11y-btn:hover {
  background: rgba(255, 247, 233, .14);
}

.a11y-btn:active {
  background: rgba(255, 247, 233, .24);
}

.a11y-btn[aria-pressed="true"] {
  background: var(--pink);
  color: #fff;
}

.a11y-btn:focus-visible {
  outline-color: #fff;
  outline-offset: -3px;
}

.a11y-sep {
  width: 1px;
  height: 16px;
  background: rgba(255, 247, 233, .3);
  margin-inline: 6px;
}

/* BHASHINI translation plugin, mounted into the a11y bar */
.a11y-translate {
  display: flex;
  align-items: center;
}

.a11y-translate .bhashini-plugin-container {
  display: flex;
  align-items: center;
  min-width: 34px;
  min-height: 34px;
}

.a11y-translate .bhashini-dropdown {
  position: relative;
  z-index: 1000;
}

.a11y-translate .bhashini-dropdown-btn {
  min-height: 34px;
  min-width: 34px;
  padding: 0 6px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
}

.a11y-translate .bhashini-dropdown-btn:hover {
  background: rgba(255, 247, 233, .12);
}

.a11y-translate .bhashini-dropdown-btn:focus-visible {
  outline: 2px solid var(--cream);
  outline-offset: -3px;
}

.a11y-translate .bhashini-dropdown-btn-icon svg {
  width: 22px;
  height: 22px;
}

/* open downwards and keep inside the viewport (the bar sits at the top edge) */
.a11y-bar .a11y-translate .bhashini-dropdown-content,
.a11y-bar .a11y-translate .bhashini-dropdown-content.show-up {
  /* !important: the plugin writes inline top/left on every open and pushes it off-screen here */
  top: calc(100% + 6px) !important;
  bottom: auto !important;
  right: 0 !important;
  left: auto !important;
  max-height: min(25rem, calc(100vh - var(--bar-h) - 24px));
  font-size: 15px;
}

.icon-sun {
  display: none;
}

[data-theme="dark"] .icon-sun {
  display: block;
}

[data-theme="dark"] .icon-moon {
  display: none;
}

.lang {
  position: relative;
}

.lang .chev {
  transition: transform .25s var(--ease);
}

.lang [aria-expanded="true"] .chev {
  transform: rotate(180deg);
}

.lang__list {
  position: absolute;
  right: 0;
  top: 100%;
  min-width: 160px;
  background: var(--cream);
  color: var(--maroon);
  border: 1px solid var(--maroon);
  box-shadow: 0 10px 30px rgba(115, 12, 57, .2);
  z-index: 70;
}

.lang__list[hidden] {
  display: none;
}

.lang__list li {
  padding: 12px 16px;
  font-size: .9rem;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.lang__list li[aria-selected="true"] {
  font-weight: 700;
}

.lang__list li[aria-selected="true"]::after {
  content: "\2713";
  color: var(--pink);
}

/* check mark, escaped so file encoding cannot corrupt it */
.lang__list li:hover,
.lang__list li:focus {
  background: var(--tint);
  outline: none;
}

/* Dark theme: --tint turns near-black, so keep a light highlight behind the maroon text */
[data-theme="dark"] .lang__list li:hover,
[data-theme="dark"] .lang__list li:focus {
  background: #fde6e4;
}

.lang__list li:focus-visible {
  outline: 3px solid var(--pink);
  outline-offset: -3px;
}

/* ---------- Sticky header ---------- */
.site-header {
  position: sticky;
  top: var(--bar-h);
  z-index: 50;
  height: var(--head-h);
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  transition: height .5s var(--ease), background-color .5s var(--ease), box-shadow .5s var(--ease);
}

.site-header__inner {
  position: relative;
  height: 100%;
  max-width: 2000px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: calc(var(--gutter) + 40px);
}

.site-header__nav {
  display: flex;
  align-items: center;
  gap: clamp(20px, 2.6vw, 44px);
  z-index: 2;
}

.menu-btn,
.nav-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  font-size: 1.0625rem;
  text-decoration: none;
  position: relative;
  padding-block: 4px;
}

.menu-btn__bars {
  display: grid;
  gap: 3px;
  width: 13px;
}

.menu-btn__bars i {
  display: block;
  height: 1.3px;
  background: currentColor;
  transition: transform .4s var(--ease), opacity .3s;
  transform-origin: left;
}

.menu-btn:hover .menu-btn__bars i:nth-child(2) {
  transform: scaleX(.6);
}

.menu-btn:hover .menu-btn__bars i:nth-child(3) {
  transform: scaleX(.8);
}

.menu-btn::after,
.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 6px;
  height: 1.5px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .5s var(--ease);
}

.menu-btn:hover::after,
.nav-link:hover::after,
.menu-btn:focus-visible::after,
.nav-link:focus-visible::after {
  transform: scaleX(1);
}

/* Brand */
.brand {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  gap: 18px;
  text-decoration: none;
  color: var(--ink);
  transition: transform .5s var(--ease);
}

.brand__mark {
  display: grid;
  gap: 4px;
}

.brand__title {
  font-family: var(--font-display);
  font-size: 1.5rem;
  line-height: 1.02;
  letter-spacing: -.01em;
}

.brand__title em {
  font-style: italic;
}

.brand__tag {
  font-size: .5rem;
  font-weight: 500;
  letter-spacing: .01em;
  white-space: nowrap;
}

.brand__rule {
  width: 1px;
  height: 78px;
  background: currentColor;
  opacity: .85;
}

.brand__ministry {
  display: flex;
  align-items: center;
  gap: 6px;
}

.brand__emblem {
  width: 44px;
  height: 52px;
}

.brand__ministry-text {
  display: grid;
  font-size: .76rem;
  line-height: 1.12;
  letter-spacing: .01em;
}

.brand__ministry-text [lang="hi"] {
  font-weight: 700;
  font-size: .78rem;
}

.brand__ministry-text strong {
  font-size: 1.12rem;
  letter-spacing: .03em;
  font-weight: 700;
}

.brand--light {
  position: static;
  transform: none;
  color: var(--cream);
}

/* Header logo: light-theme logo by default, white logo in dark theme */
.brand__logo {
  display: block;
}

.brand__logo--dark {
  display: none;
}

[data-theme="dark"] .brand__logo--light {
  display: none;
}

[data-theme="dark"] .brand__logo--dark {
  display: block;
}

/* Pass button in header: flush to the top-right edge like the reference */
.btn-pass {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 40px;
  background: var(--pink);
  color: #fff;
  font-weight: 400;
  font-size: 1.05rem;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: transform .4s var(--ease), background-color .3s;
  border-radius: 10px;
}

.btn-pass::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--maroon);
  transform: translateY(101%);
  transition: transform .5s var(--ease);
  z-index: -1;
}

.btn-pass:hover::before,
.btn-pass:focus-visible::before {
  transform: translateY(0);
}

.btn-pass:active {
  transform: scale(.98);
}

.site-header .btn-pass {
  /* position: absolute;
  top: 0; */
  right: var(--gutter);
  height: 63px;
  padding: 0 40px;
  border-radius: 10px;
}

.btn-pass--lg {
  height: 63px;
  padding: 0 40px;
  font-size: 1.05rem;
  border-radius: 10px;
  border: 1px solid #62543D;
  color: #000;
  background: none;
}

.btn-pass--inline {
  padding: 0 32px;
}

/* Header scrolled */
.site-header.is-scrolled {
  box-shadow: 0 8px 28px rgba(115, 12, 57, .08);
}

@media (min-width: 900px) {
  .site-header.is-scrolled {
    height: 92px;
  }

  .site-header.is-scrolled .brand {
    transform: translate(-50%, -50%) scale(.86);
  }

  .site-header.is-scrolled .btn-pass {
    height: 52px;
  }
}

/* Outline button */
.btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 40px;
  border: 1.5px solid var(--accent);
  background-color: var(--pink);
  /* background: transparent; */
  /* color: var(--ink); */
  font-weight: 600;
  font-size: 1.05rem;
  text-decoration: none;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: color .4s var(--ease);
  border-radius: 10px;
  color: #fff;

}

.btn-outline::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--accent);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform .5s var(--ease);
  z-index: -1;
}

.btn-outline:hover,
.btn-outline:focus-visible {
  color: #fff;
}

.btn-outline:hover::before,
.btn-outline:focus-visible::before {
  transform: scaleY(1);
}

.btn-outline--sm {
  min-height: 42px;
  padding: 0 26px;
  font-size: .9rem;
  text-transform: uppercase;
  letter-spacing: .01em;
  font-weight: 500;
}

/* ---------- Menu overlay ---------- */
.menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: var(--pink);
  color: var(--cream);
  display: grid;
  grid-template-rows: auto 1fr auto;
  overflow: hidden;
  clip-path: circle(0% at 60px 70px);
  visibility: hidden;
  transition: clip-path .9s var(--ease), visibility 0s linear .9s;
}

.menu-overlay[hidden] {
  display: grid;
}

.menu-overlay.is-open {
  clip-path: circle(150% at 60px 70px);
  visibility: visible;
  transition: clip-path .9s var(--ease), visibility 0s;
}

.menu-overlay__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.menu-art {
  position: absolute;
  bottom: -4%;
  opacity: .16;
  filter: invert(1) brightness(2);
}

.menu-art--l {
  left: -6%;
  width: min(46vw, 640px);
}

.menu-art--r {
  right: -6%;
  width: min(50vw, 720px);
}

/* Fort backdrop (b7.png): full width, natural height, anchored to the bottom so it is never cropped
   or stretched. Its black sky disappears via screen blend against the pink. */
.menu-art--fort {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  max-height: none;
  mix-blend-mode: screen;
  opacity: .3;
  filter: grayscale(1);
}

.menu-overlay__top {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 26px var(--gutter);
}

.menu-overlay__eyebrow {
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.4rem;
}

.menu-close {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 20px;
  border: 1px solid rgba(255, 247, 233, .5);
  border-radius: 999px;
  color: var(--cream);
  font-weight: 500;
  transition: background-color .3s, color .3s, transform .4s var(--ease);
}

.menu-close svg {
  transition: transform .5s var(--ease);
}

.menu-close:hover {
  background: var(--cream);
  color: var(--maroon);
}

.menu-close:hover svg {
  transform: rotate(90deg);
}

/* align-items:flex-start + margin-block:auto centres the list but still lets it scroll from the
   first item when the screen is short (align-items:center pushed "Home" out of reach). */
.menu-overlay__nav {
  position: relative;
  padding: 0 var(--gutter);
  display: flex;
  align-items: flex-start;
  overflow-y: auto;
  min-height: 0;
}

.menu-list {
  width: 100%;
  counter-reset: m;
  margin-block: auto;
}

.menu-list li {
  overflow: hidden;
  border-bottom: 1px solid rgba(255, 247, 233, .28);
}

.menu-list a {
  display: flex;
  align-items: baseline;
  gap: 24px;
  padding: clamp(6px, 1.2vh, 14px) 0;
  text-decoration: none;
  color: var(--cream);
  transition: color .3s, padding-left .6s var(--ease);
}

.menu-list__n {
  font-size: .8rem;
  letter-spacing: .1em;
  opacity: .7;
  min-width: 2ch;
}

.menu-list__t {
  font-family: var(--font-display);
  /* Sized from the viewport height so all 9 items fit between the top bar and the footer row. */
  font-size: clamp(1.5rem, min(calc((100dvh - 230px) / 14), 11vw), 4.6rem);
  line-height: 1.1;
  transform: translateY(110%);
  transition: transform .9s var(--ease);
}

.menu-overlay.is-open .menu-list__t {
  transform: translateY(0);
}

.menu-overlay.is-open .menu-list li:nth-child(1) .menu-list__t {
  transition-delay: .25s;
}

.menu-overlay.is-open .menu-list li:nth-child(2) .menu-list__t {
  transition-delay: .31s;
}

.menu-overlay.is-open .menu-list li:nth-child(3) .menu-list__t {
  transition-delay: .37s;
}

.menu-overlay.is-open .menu-list li:nth-child(4) .menu-list__t {
  transition-delay: .43s;
}

.menu-overlay.is-open .menu-list li:nth-child(5) .menu-list__t {
  transition-delay: .49s;
}

.menu-overlay.is-open .menu-list li:nth-child(6) .menu-list__t {
  transition-delay: .55s;
}

.menu-overlay.is-open .menu-list li:nth-child(7) .menu-list__t {
  transition-delay: .61s;
}

.menu-overlay.is-open .menu-list li:nth-child(8) .menu-list__t {
  transition-delay: .67s;
}

.menu-overlay.is-open .menu-list li:nth-child(9) .menu-list__t {
  transition-delay: .73s;
}

.menu-list a:hover,
.menu-list a:focus-visible {
  padding-left: 18px;
}

.menu-list a:hover .menu-list__t,
.menu-list a:focus-visible .menu-list__t {
  font-style: italic;
}

.menu-list a:hover .menu-list__n {
  color: var(--pink);
  opacity: 1;
}

.menu-overlay__foot {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  padding: 22px var(--gutter) 28px;
  font-size: .95rem;
  letter-spacing: .04em;
}

/* Overlay is pink, so the pink pass button flips to cream (maroon fill on hover is kept) */
.menu-overlay .btn-pass {
  background: var(--cream);
  color: var(--pink);
  font-weight: 500;
  display : none;
}

.menu-overlay .btn-pass:hover,
.menu-overlay .btn-pass:focus-visible {
  color: #fff;
}

body.menu-open {
  overflow: hidden;
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  height: calc(100vh - var(--bar-h) - var(--head-h));
  height: calc(100dvh - var(--bar-h) - var(--head-h));
  min-height: 480px;
  max-height: calc(100dvh - var(--bar-h) - var(--head-h));
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  overflow: hidden;
  box-sizing: border-box;
  padding-block: clamp(12px, 2.2vh, 34px) clamp(16px, 2.8vh, 42px);
  padding-inline: var(--gutter);
}

.hero__art {
  position: absolute;
  bottom: 0;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  will-change: transform;
}

.hero__art--l {
  left: 0;
  width: clamp(240px, 27vw, 540px);
  max-height: 48vh;
  object-fit: contain;
  object-position: bottom left;
}

.hero__art--r {
  right: 0;
  width: clamp(280px, 34vw, 680px);
  max-height: 52vh;
  object-fit: contain;
  object-position: bottom right;
}

.hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: clamp(5px, 0.3vw, 18px);
  margin-top: 0;
  width: 100%;
  max-width: 1850px;
}

.hero__dates {
  justify-self: end;
  align-self: center;
  margin-top: 0;
  transform: translateY(clamp(16px, 3.5vh, 44px));
  color: var(--accent);
  font-size: clamp(1.2rem, min(1.85vw, 3vh), 2.35rem);
  line-height: 1.12;
  font-weight: 300;
  letter-spacing: -.01em;
  padding-right: clamp(0px, 1.5vw, 30px);
}

.hero__city {
  justify-self: start;
  align-self: center;
  margin-top: 0;
  transform: translateY(clamp(16px, 3.5vh, 44px));
  color: var(--accent);
  font-size: clamp(1.2rem, min(1.85vw, 3vh), 2.35rem);
  font-weight: 300;
  padding-left: clamp(0px, 2.5vw, 60px);
}

.hero__title {
  display: grid;
  font-family: "Season Mix-TRIAL";
  font-weight: 400;
  color: var(--ink);
}

.hero__title--center {
  text-align: center;
  justify-items: center;
}

.hero__word {
  display: block;
  font-size: clamp(4.2rem, min(14.8vw, 17.5vh), 16.8rem);
  line-height: .92;
  letter-spacing: -.035em;
}

.hero__row {
  display: flex;
  align-items: flex-end;
}

.hero__row--center {
  justify-content: center;
}

.hero__row--1 {
  align-items: center;
}

.hero__row--1 .hero__small {
  margin-left: clamp(14px, 2vw, 36px);
}

.hero__row--3 {
  justify-content: flex-start;
  align-items: flex-end;
  gap: clamp(10px, 1.6vw, 26px);
  margin-top: -.06em;
}

.hero__row--3 .hero__small {
  padding-bottom: clamp(12px, 1.8vh, 32px);
}

.hero__row--3 .hero__word {
  margin-left: auto;
}

.hero__small {
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1rem, min(1.25vw, 2.4vh), 1.7rem);
  line-height: 1.25;
  color: var(--ink-soft);
  letter-spacing: .01em;
}

.hero__row--1 .hero__small {
  font-size: clamp(1.1rem, min(1.55vw, 2.8vh), 2rem);
}

.hero__devanagari {
  display: none;
}

.hero__calendar-btn {
  display: none;
}

.hero__cta {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
  margin-top: clamp(12px, 2.5vh, 36px);
}

/* ---------- Line reveal ---------- */
.reveal-line {
  display: block;
  overflow: hidden;
  padding: 0.2em 0.1em;
  /* Margin is removed to prevent layout collapse */
}

.reveal-line>span,
.reveal-line>strong {
  display: inline-block;
  transform: translateY(105%);
  transition: transform 1.2s var(--ease);
}

.reveal-line.is-in>span,
.reveal-line.is-in>strong {
  transform: translateY(0);
}

.reveal-line:nth-child(2)>* {
  transition-delay: .12s;
}

.reveal-line:nth-child(3)>* {
  transition-delay: .24s;
}

.hero__row--2 .reveal-line>span {
  transition-delay: .15s;
}

.hero__row--3 .reveal-line>span {
  transition-delay: .3s;
}

.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1.2s var(--ease), transform 1.2s var(--ease);
}

.reveal.is-in {
  opacity: 1;
  transform: translateY(0);
}

/* ---------- Intro ---------- */
.intro {
  position: relative;
  padding: clamp(60px, 7vw, 120px) var(--gutter) clamp(60px, 7vw, 120px);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: clamp(12px, 1.5vw, 28px);
  align-items: start;
}

.intro__tree {
  position: absolute;
  left: 0;
  bottom: 6%;
  width: clamp(120px, 12vw, 240px);
  opacity: .55;
  pointer-events: none;
}

[data-theme="dark"] .intro__tree {
  opacity: .15;
  filter: invert(1);
}

.intro__title {
  grid-column: 4 / 10;
  grid-row: 1;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.4rem, 3.2vw + .6rem, 4.6rem);
  line-height: 1.06;
  letter-spacing: -.03em;
  padding-top: clamp(0px, 1vw, 20px);
}

.intro__title strong {
  font-weight: 500;
}

.intro__body {
  grid-column: 5 / 10;
  grid-row: 2;
  margin-top: clamp(40px, 5vw, 90px);
  max-width: 50ch;
  font-size: clamp(.95rem, .25vw + .83rem, 1.06rem);
  line-height: 1.7;
  color: var(--ink-soft);
}

.intro__body p+p {
  margin-top: 1.4em;
  text-align: center;
}

.intro__body .btn-outline {
  margin-top: 2.2em;
  border-radius: 10px;
}

.intro__fig {
  position: relative;
  overflow: hidden;
  background: var(--tint);
}

.intro__fig img {
  border-radius: 10px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.6s var(--ease);
}

.intro__fig:hover img {
  transform: scale(1.05);
}

.intro__fig--right {
  grid-column: 10 / 13;
  grid-row: 1 / 3;
  margin-top: clamp(20px, 3vw, 50px);
  aspect-ratio: 407 / 430;
  align-self: start;
}

.intro__fig--left {
  border-radius: 10px;
  grid-column: 1 / 4;
  grid-row: 2 / 4;
  margin-top: clamp(-40px, -2vw, 0px);
  margin-left: calc(var(--gutter) * -0.75);
  align-self: end;
  aspect-ratio: 262 / 431;
}

.intro__video {
  grid-column: 5 / 12;
  grid-row: 3;
  position: relative;
  margin-top: clamp(40px, 5vw, 100px);
}

.intro__video-frame {
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  aspect-ratio: 990 / 489;
  background: var(--tint);
}

.intro__video-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: drift 24s ease-in-out infinite alternate;
}

.intro__video-frame.is-paused img {
  animation-play-state: paused;
}

@keyframes drift {
  from {
    transform: scale(1.02) translateX(0);
  }

  to {
    transform: scale(1.1) translateX(-1.5%);
  }
}

.intro__mod {
  position: absolute;
  right: clamp(-200px, -9vw, -30px);
  bottom: 0;
  display: flex;
  align-items: flex-end;
  gap: 8px;
  font-size: .8rem;
  line-height: 1.15;
  color: var(--ink-soft);
}

.intro__mod strong {
  font-size: 1rem;
}

.play-btn {
  position: absolute;
  left: 18px;
  bottom: 18px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--cream);
  color: var(--maroon);
  display: grid;
  place-items: center;
  transition: transform .4s var(--ease), background-color .3s, color .3s;
}

.play-btn:hover {
  background: var(--pink);
  color: #fff;
  transform: scale(1.08);
}

.play-btn .i-play {
  display: none;
}

.play-btn[aria-pressed="true"] .i-play {
  display: block;
}

.play-btn[aria-pressed="true"] .i-pause {
  display: none;
}

/* ---------- Reflection of Art ---------- */
.themes {
  position: relative;
  padding: clamp(10px, 3vw, 60px) 0 clamp(80px, 8vw, 160px);
  overflow: hidden;
}

.themes__title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(3.4rem, 10.4vw, 14rem);
  line-height: 1.12;
  letter-spacing: -.035em;
  white-space: nowrap;
  padding-inline: clamp(12px, 5.4vw, 104px);
  color: var(--ink);
}

.themes__title em {
  font-style: italic;
  font-weight: 300;
  font-size: .96em;
  margin-inline: .06em;
}

.themes__curve {
  position: absolute;
  left: var(--gutter);
  right: 0;
  top: 32%;
  width: calc(100% - var(--gutter));
  height: 55%;
  color: var(--maroon);
  opacity: .28;
  pointer-events: none;
  z-index: 0;
}

.themes__curve path {
  stroke-dasharray: 4200;
  stroke-dashoffset: 4200;
  transition: stroke-dashoffset 3.6s var(--ease);
}

.themes.is-drawn .themes__curve path {
  stroke-dashoffset: 0;
}

.themes__list {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  padding-inline: var(--gutter);
  margin-top: clamp(40px, 5vw, 100px);
  align-items: start;
  column-gap: clamp(24px, 2.8vw, 52px);
}

.theme h3 {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(1.8rem, 1.7vw + .8rem, 3rem);
  line-height: 1.1;
  letter-spacing: -.02em;
  margin-bottom: clamp(16px, 1.6vw, 30px);
}

.theme__img {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 342 / 283;
}

.theme__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 1.6s var(--ease);
}

.theme:hover .theme__img img {
  transform: scale(1.06);
}

.theme__dot {
  position: absolute;
  width: 17%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--dot);
  transition: transform .8s var(--ease);
}

.theme:hover .theme__dot {
  transform: scale(1.18);
}

.theme--1 .theme__dot {
  left: 50%;
  top: 44%;
  transform-origin: center;
  margin: -8.5% 0 0 -8.5%;
}

.theme--2 .theme__dot {
  left: 42%;
  top: 22%;
  margin: -8.5% 0 0 -8.5%;
}

.theme--3 .theme__dot {
  left: 50%;
  top: 30%;
  margin: -8.5% 0 0 -8.5%;
}

.theme--4 .theme__dot {
  left: 50%;
  top: 28%;
  margin: -8.5% 0 0 -8.5%;
}

.theme p {
  margin-top: clamp(24px, 2.6vw, 46px);
  max-width: 28ch;
  font-size: clamp(.9rem, .2vw + .85rem, 1rem);
  line-height: 1.6;
  color: var(--ink-soft);
}

.theme--1 {
  grid-column: 1 / 4;
  margin-top: clamp(40px, 5vw, 90px);
}

.theme--2 {
  grid-column: 4 / 7;
  margin-top: 0;
}

.theme--3 {
  grid-column: 7 / 10;
  margin-top: clamp(40px, 5vw, 90px);
}

.theme--4 {
  grid-column: 10 / 13;
  margin-top: 0;
}

/* ---------- Explore the Biennale ---------- */
.explore-new {
  padding-block: clamp(80px, 8vw, 120px);
  background-color: var(--bg);
  color: var(--ink);
  overflow: hidden;
}

.explore-new__container {
  display: flex;
  gap: clamp(40px, 6vw, 80px);
  /* max-width: 1400px;
  margin: 0 auto; */
  align-items: stretch;
  padding-inline: var(--gutter);
}

.explore-new__left {
  flex: 1;
  max-width: 50%;
  display: flex;
  flex-direction: column;
}

.explore-new__title {
  font-family: var(--font-display);
  font-size: clamp(4.5rem, 8vw, 7.5rem);
  font-weight: 300;
  color: var(--pink);
  margin-bottom: 40px;
  line-height: 1.1;
  margin-top: 0;
}

.explore-new__list {
  display: flex;
  flex-direction: column;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.explore-new__item {
  display: flex;
  align-items: center;
  padding: 30px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  cursor: pointer;
  transition: all 0.4s ease;
  position: relative;
}

.explore-new__item-num {
  font-family: var(--font-ui);
  font-size: 0.9rem;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.4);
  width: 40px;
  transition: color 0.4s ease;
  flex-shrink: 0;
}

.explore-new__item-content {
  flex: 1;
  padding-right: 20px;
}

.explore-new__item-title {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 300;
  margin: 0 0 8px 0;
  color: var(--ink);
  transition: color 0.4s ease;
}

.explore-new__item-desc {
  font-family: var(--font-ui);
  font-size: 0.9rem;
  color: rgba(0, 0, 0, 0.6);
  line-height: 1.5;
  margin: 0;
  max-width: 95%;
  transition: color 0.4s ease;
}

.explore-new__item-thumb {
  width: 80px;
  height: 50px;
  border-radius: 6px;
  overflow: hidden;
  margin-right: 20px;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  opacity: 1;
  flex-shrink: 0;
}

.explore-new__item-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.explore-new__item-arrow {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(0, 0, 0, 0.4);
  transition: all 0.4s ease;
  flex-shrink: 0;
}

.explore-new__item-arrow svg {
  width: 16px;
  height: 16px;
}

/* Hover / Active States */
.explore-new__item.active .explore-new__item-num,
.explore-new__item:hover .explore-new__item-num {
  color: var(--pink);
}

.explore-new__item.active .explore-new__item-title,
.explore-new__item:hover .explore-new__item-title {
  color: var(--pink);
}

.explore-new__item.active .explore-new__item-arrow,
.explore-new__item:hover .explore-new__item-arrow {
  background-color: var(--pink);
  border-color: var(--pink);
  color: #fff;
}

.explore-new__item.active .explore-new__item-thumb,
.explore-new__item:hover .explore-new__item-thumb {
  opacity: 0;
  width: 0;
  margin-right: 0;
}

/* Right Side Gallery */
.explore-new__right {
  flex: 1;
  position: relative;
  border-radius: 32px;
  overflow: hidden;
  min-height: 600px;
}

.explore-new__featured-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.8s cubic-bezier(0.25, 0.1, 0.25, 1);
  z-index: 1;
}

.explore-new__featured-img.active {
  opacity: 1;
  z-index: 2;
}

@media (max-width: 991px) {
  .explore-new__container {
    flex-direction: column;
  }

  .explore-new__left {
    max-width: 100%;
  }

  .explore-new__right {
    min-height: 400px;
    width: 100%;
  }
}

@media (max-width: 500px) {
  .explore-new__item-thumb {
    display: none;
  }
}

/* Explore Dark Mode Overrides */
[data-theme="dark"] .explore-new__list {
  border-top-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .explore-new__item {
  border-bottom-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .explore-new__item-num {
  color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .explore-new__item.active .explore-new__item-num,
[data-theme="dark"] .explore-new__item:hover .explore-new__item-num {
  color: var(--pink);
}

[data-theme="dark"] .explore-new__item-desc {
  color: rgba(255, 255, 255, 0.7);
}

[data-theme="dark"] .explore-new__item-arrow {
  border-color: rgba(255, 255, 255, 0.2);
  color: rgba(255, 255, 255, 0.5);
}

[data-theme="dark"] .explore-new__item.active .explore-new__item-arrow,
[data-theme="dark"] .explore-new__item:hover .explore-new__item-arrow {
  background-color: var(--pink);
  border-color: var(--pink);
  color: #fff;
}


/* ---------- Curatorial Statement ---------- */
.curatorial {
  background-color: #FCEFD9;
  padding: 60px 30px;
}

[data-theme="dark"] .curatorial {
  /* Text/CTA already follow var(--ink)/var(--pink); only the fixed cream ground needed a dark value. */
  background-color: #16120E;
  padding-top: clamp(60px, 8vw, 120px);
  padding-bottom: clamp(60px, 8vw, 120px);
  padding-inline: var(--gutter);
}

.curatorial__header {
  margin-bottom: clamp(40px, 6vw, 80px);
  max-width: 1400px;
  margin-inline: auto;
}

.curatorial__devanagari {
  font-family: var(--font-ui);
  font-size: clamp(2.2rem, 2.5vw, 2.5rem) !important;
  color: var(--ink);
  margin-bottom: 0.2em;
}

.curatorial__title {
  font-family: var(--font-display);
  font-size: clamp(5.5rem, 9vw, 9.5rem) !important;
  font-weight: 400;
  line-height: 1;
  color: var(--ink);
}

.curatorial__title em {
  font-style: initial !important;
}

.curotorial-name {
  font-size: 17px !important;
  line-height: 1.1 !important;
  margin-top: 20px !important;
  padding-top: 20px !important;
}

.curatorial__content {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.curatorial__grid {
  position: relative;
  width: 100%;
  max-width: 900px;
  min-height: clamp(500px, 70vw, 680px);
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.curatorial__text {
  font-family: var(--font-display);
  font-size: clamp(1.7rem, 2.6vw, 2.6rem) !important;
  font-weight: 300;
  line-height: 1.15;
  text-align: center;
  max-width: 20ch;
  color: var(--ink);
  position: relative;
  z-index: 2;
  letter-spacing: -0.01em;
  padding: 0 20px;
}

.curatorial__img {
  position: absolute;
  object-fit: cover;
  z-index: 1;
  border-radius: 12px;
}

.curatorial__img--tl {
  width: clamp(140px, 18vw, 230px);
  height: clamp(180px, 24vw, 310px);
  top: 0;
  left: 0;
}

.curatorial__img--tr {
  width: clamp(150px, 20vw, 260px);
  height: clamp(110px, 15vw, 190px);
  top: 5%;
  right: 0;
}

.curatorial__img--bl {
  width: clamp(140px, 18vw, 240px);
  height: clamp(140px, 18vw, 240px);
  bottom: 10%;
  left: 2%;
}

.curatorial__img--br {
  width: clamp(120px, 16vw, 200px);
  height: clamp(180px, 24vw, 320px);
  bottom: 0;
  right: 5%;
}

.curatorial__cta {
  margin-top: clamp(40px, 6vw, 80px);
}

/* ---------- Redesigned Curatorial Section ---------- */
.curatorial-redesigned {
  padding: clamp(80px, 8vw, 120px) var(--gutter);
  background-color: #FFF1DC;
  /* Lighter, softer shade from the same color family */
  /* Elegant, artistic diagonal hatching pattern like premium stationery */
  background-image: repeating-linear-gradient(45deg,
      rgba(98, 84, 61, 0.04) 0,
      rgba(98, 84, 61, 0.04) 1px,
      transparent 1px,
      transparent 12px);
  overflow: hidden;
  position: relative;
}

.curatorial-redesigned::before {
  content: '';
  position: absolute;
  top: -20%;
  left: -10%;
  width: 50vw;
  height: 50vw;
  background: radial-gradient(circle, rgba(212, 175, 55, 0.07) 0%, transparent 70%);
  /* Soft premium gold glow */
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.curatorial-redesigned::after {
  content: '';
  position: absolute;
  bottom: -20%;
  right: -5%;
  width: 45vw;
  height: 45vw;
  background: radial-gradient(circle, rgba(98, 84, 61, 0.06) 0%, transparent 70%);
  /* Very soft earthy glow */
  border-radius: 50%;

  pointer-events: none;
  z-index: 0;
}

.curatorial-redesigned__container {
  position: relative;
  z-index: 1;
  max-width: 1300px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: clamp(40px, 6vw, 100px);
}

.curatorial-redesigned__content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.curatorial-redesigned__header {
  margin-bottom: clamp(30px, 4vw, 50px);
}

.curatorial-redesigned__devanagari {
  font-family: var(--font-ui);
  font-size: clamp(1.2rem, 1.5vw, 1.4rem);
  color: var(--ink);
  opacity: 0.8;
  margin: 0 0 8px 0;
  letter-spacing: 1px;
}

.curatorial-redesigned__title {
  font-family: var(--font-display);
  font-size: clamp(4rem, 8vw, 7rem);
  font-weight: 300;
  color: var(--ink);
  margin: 0;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.curatorial-redesigned__title em {
  font-style: italic;
}

.curatorial-redesigned__text-block {
  max-width: 600px;
}

.curatorial-redesigned__lead {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  line-height: 1.4;
  color: var(--ink);
  margin: 0 0 24px 0;
  font-weight: 300;
}

.curatorial-redesigned__desc {
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.2vw, 1.1rem);
  line-height: 1.7;
  color: var(--ink);
  opacity: 0.7;
  margin: 0 0 40px 0;
}

.curatorial-redesigned__cta {
  margin-top: 10px;
}

.curatorial-redesigned__image-wrapper {
  flex: 1;
  max-width: 500px;
  position: relative;
  display: flex;
  justify-content: center;
}

.curatorial-redesigned__img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
}

/* Dark Mode Overrides */
[data-theme="dark"] .curatorial-redesigned {
  background-color: var(--bg);
  background-image: repeating-linear-gradient(45deg,
      rgba(255, 255, 255, 0.03) 0,
      rgba(255, 255, 255, 0.03) 1px,
      transparent 1px,
      transparent 12px);
}

[data-theme="dark"] .curatorial-redesigned__img {
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

@media (max-width: 900px) {
  .curatorial-redesigned__container {
    flex-direction: column;
  }

  .curatorial-redesigned__image-wrapper {
    max-width: 100%;
    width: 100%;
  }
}

/* Desktop/tablet: same scattered layout, but the text column keeps clear of the
   side images (padding = widest side image + its offset + a gap), so they never overlap. */
@media (min-width: 769px) {
  .curatorial__grid {
    max-width: 1300px;
  }

  .curatorial__text {
    max-width: none;
    padding-inline: calc(clamp(150px, 20vw, 260px) + 5% + 24px);
    font-size: clamp(1.8rem, 3.2vw, 3.2rem);
  }
}

@media (max-width: 768px) {
  .curatorial__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding: 0;
    min-height: auto;
  }

  .curatorial__text {
    grid-column: 1 / -1;
    grid-row: 2;
    padding: 40px 0;
    max-width: none;
    font-size: clamp(1.8rem, 5vw, 2.4rem);
  }

  .curatorial__img {
    position: static;
    width: 100%;
    height: 100%;
    aspect-ratio: 1;
  }

  .curatorial__img--tl {
    grid-column: 1;
    grid-row: 1;
  }

  .curatorial__img--tr {
    grid-column: 2;
    grid-row: 1;
  }

  .curatorial__img--bl {
    grid-column: 1;
    grid-row: 3;
  }

  .curatorial__img--br {
    grid-column: 2;
    grid-row: 3;
  }
}


/* ---------- Featured Participants ---------- */
.featured-participants {
  padding: clamp(60px, 8vw, 120px) var(--gutter);
  text-align: center;
  padding-top: 0 !important;
}

.featured-participants__header {
  margin-bottom: clamp(50px, 7vw, 90px);
}

.featured-participants__title {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 8vw, 8rem);
  font-weight: 300;
  line-height: 1.1;
  color: var(--ink);
  letter-spacing: -0.02em;
  margin-bottom: 24px;
}

.featured-participants__title em {
  font-style: italic;
}

.featured-participants__subtitle {
  font-family: var(--font-ui);
  font-size: clamp(1.2rem, 2vw, 1.8rem);
  font-weight: 300;
  color: var(--ink);
  line-height: 1.4;
}

.text-pink {
  color: var(--pink);
  font-weight: 400;
}

.featured-participants__grid {
  display: grid;
  grid-template-columns: 1fr 1.6fr 1fr;
  gap: clamp(20px, 4vw, 80px);
  align-items: center;
  max-width: 1400px;
  margin: 0 auto;
}

.participant-card {
  display: flex;
  flex-direction: column;
  text-align: left;
}

.participant-card__img-wrapper {
  width: 100%;
  margin-bottom: 16px;
  border-radius: 10px;
}

.participant-card__img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

.participant-card__name {
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  font-weight: 400;
  color: var(--ink);
}

.featured-participants__cta {
  /* margin-top: clamp(50px, 7vw, 90px); */
  display: flex;
  justify-content: center;
}

.featured-participants__cta {
  margin-top: 30px;
}

@media (max-width: 768px) {
  .featured-participants__grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .participant-card {
    align-items: center;
    text-align: center;
  }

  .participant-card__img-wrapper {
    max-width: 80%;
  }
}


/* ---------- Leadership Messages ---------- */
.messages {
  background: linear-gradient(135deg, #a40842 0%, #fa207f 100%);
  padding: clamp(80px, 10vw, 160px) var(--gutter);
  color: #fff;
  margin-top: clamp(40px, 4vw, 70px) !important;
}

.messages__container {
  max-width: 1400px;
  margin: 0 auto;
}

.msg-leader {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: clamp(40px, 6vw, 100px);
}

.msg-leader__content {
  position: relative;
}

.msg-quote-icon {
  font-family: var(--font-display);
  font-size: clamp(3rem, 5vw, 6rem);
  line-height: 0;
  color: rgba(255, 255, 255, 0.4);
  display: inline-block;
  transform: translateY(0.3em);
}

.msg-quote-icon--end {
  transform: translateY(0.6em);
  margin-left: 0.2em;
}

.msg-leader__quote {
  font-family: var(--font-display);
  font-size: clamp(2rem, 3.5vw, 4rem);
  font-weight: 300;
  line-height: 1.15;
  margin-bottom: 30px;
  letter-spacing: -0.01em;
}

.msg-author__name {
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.2vw, 1.4rem);
  font-weight: 500;
  margin-bottom: 4px;
}

.msg-author__title {
  font-family: var(--font-ui);
  font-size: clamp(0.85rem, 1vw, 1.1rem);
  font-weight: 300;
  opacity: 0.9;
}

.msg-leader__img-wrapper {
  width: 100%;
}

.msg-leader__img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 10px;
}

.messages__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 8vw, 120px);
  margin-top: clamp(80px, 10vw, 160px);
}

.msg-card {
  display: flex;
  flex-direction: column;
}

.msg-card--right {
  margin-top: clamp(60px, 12vw, 240px);
}

.msg-card__img-wrapper {
  width: 100%;
  max-width: clamp(200px, 25vw, 340px);
  margin-bottom: 32px;
}

.msg-card__img {
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 10px;
}

.msg-card__content {
  position: relative;
}

.msg-card__quote {
  font-family: var(--font-ui);
  font-size: clamp(0.95rem, 1.1vw, 1.25rem);
  font-weight: 300;
  line-height: 1.6;
  margin-bottom: 24px;
}

.msg-card__quote .msg-quote-icon {
  font-size: clamp(2rem, 3vw, 4rem);
  transform: translateY(0.4em);
}

.msg-card__quote .msg-quote-icon--end {
  transform: translateY(0.6em);
}

@media (max-width: 768px) {
  .msg-leader {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .msg-leader__content {
    order: 2;
  }

  .msg-leader__img-wrapper {
    order: 1;
  }

  .messages__grid {
    grid-template-columns: 1fr;
    margin-top: 60px;
    gap: 60px;
  }

  .msg-card--right {
    margin-top: 0;
  }

  .msg-card {
    text-align: center;
  }

  .msg-card__img-wrapper {
    margin-inline: auto;
  }
}

/* ---------- Events ---------- */
.events {
  padding-top: clamp(40px, 4vw, 70px);
  outline: none;
  padding-top: 0 !important;
}

.events__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(3.5rem, 6vw, 5.5rem);
  line-height: 1.1;
  color: var(--ink);
  padding-bottom: clamp(40px, 5vw, 60px);
  margin: 0;
  padding-inline: var(--gutter);
}

.events__list {
  border-bottom: 1px solid var(--line);
}

.event {
  display: grid;
  grid-template-columns: 2fr 3.1fr 3.9fr 2.6fr;
  column-gap: clamp(16px, 2vw, 40px);
  align-items: start;
  padding: clamp(18px, 1.6vw, 28px) var(--gutter);
  border-top: 1px solid var(--line);
  position: relative;
  transition: background-color .6s var(--ease);
}

.event:first-child {
  border-top: 0;
}

.event--active,
.event:hover {
  background: var(--tint);
}

.event__meta {
  font-size: clamp(.75rem, .2vw + .65rem, 0.9rem);
  line-height: 1.22;
  letter-spacing: .02em;
  font-weight: 400;
  text-transform: uppercase;
  padding-top: 6px;
}

.event--active .event__meta {
  color: var(--accent);
}

.event__main h3 {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(1.2rem, 1.1vw + .4rem, 1.7rem);
  line-height: 1.2;
  letter-spacing: -.02em;
  margin-bottom: 18px;
}

.event__link {
  display: inline-block;
  font-size: .95rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .01em;
  text-decoration: none;
  border-bottom: 1.5px solid currentColor;
  padding-block: 4px 1px;
  transition: color .3s, letter-spacing .5s var(--ease);
}

.event__link:hover,
.event__link:focus-visible {
  color: var(--accent);
  letter-spacing: .06em;
}

.event__desc {
  font-size: clamp(.78rem, .1vw + .72rem, 1rem);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: 46ch;
  padding-top: 8px;
}

.event__img {
  width: 100%;
  aspect-ratio: 407 / 175;
  object-fit: cover;
  transition: transform 1.4s var(--ease);
  justify-self: end;
}

.event {
  overflow: hidden;
}

.event:hover .event__img {
  transform: scale(1.04);
}

.event__img {
  border-radius: 10px;
}

/* ---------- Coming soon ---------- */
/* ---------- Venues ---------- */
.venues {
  padding: clamp(50px, 8vw, 90px) var(--gutter);
  overflow: hidden;
  box-sizing: border-box;
  padding-top: 0 !important;
}

.venues__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(3.5rem, 6vw, 5.5rem);
  line-height: 1.1;
  color: var(--ink);
  padding-bottom: clamp(40px, 5vw, 60px);
  margin: 0;
}

.venues__grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: clamp(24px, 3vw, 40px);
  row-gap: 40px;
  align-items: start;
}

.venue {
  position: relative;
}

.venue--1 {
  grid-column: 1 / 4;
  margin-top: 0;
}

.venue--2 {
  grid-column: 4 / 7;
  margin-top: 0;
}

.venue--3 {
  grid-column: 7 / 10;
  margin-top: 0;
}

.venue--4 {
  grid-column: 10 / 13;
  margin-top: 0;
}

.venue__img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
  border-radius: 12px;
}

.venue__info {
  margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.venue__name {
  font-family: var(--font-display);
  font-size: clamp(1.0rem, 1.1vw, 1rem);
  font-weight: 400;
  color: var(--ink);
}

.agedes-btn {
  font-size: 26px;
  color: var(--pink);
  font-style: italic;
  text-align: center;
}

.venue__name--pink {
  color: var(--pink);
}

.venue__link {
  font-size: .85rem;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: underline;
  color: var(--ink);
  /* border: 1px solid var(--ink); */
  padding: 5px 16px;
  border-radius: 40px;
  transition: all .3s var(--ease);
}

.venue__link:hover {
  background: var(--ink);
  color: var(--bg);
}

.venue__link--pink {
  color: var(--pink);
  border-color: var(--pink);
}

.venue__link--pink:hover {
  background: var(--pink);
  color: #fff;
}

.venues__cta {
  display: flex;
  justify-content: center;
  margin-top: clamp(10px, 2vw, 40px);
}

.btn-solid-pink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 0 40px;
  font-size: 1.05rem;
  text-transform: uppercase;
  letter-spacing: .01em;
  border-radius: 10px;
  font-weight: 500;
  color: #fff;
  background: var(--pink);
  text-decoration: none;
  transition: transform .4s var(--ease), background-color .3s;
}

.btn-solid-pink:hover {
  background: var(--maroon);
  transform: translateY(-2px);
}

.soon {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(115, 12, 57, .86);
  animation: fade .5s var(--ease);
}

.soon[hidden] {
  display: none;
}

.soon__card {
  width: min(560px, 100%);
  padding: clamp(32px, 5vw, 64px);
  background: var(--bg);
  color: var(--ink);
  text-align: center;
  border-radius: 280px 280px 0 0;
  padding-top: clamp(80px, 12vw, 130px);
  outline: none;
}

.soon__eyebrow {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .85rem;
  font-weight: 600;
}

.soon__title {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 5vw, 3.4rem);
  line-height: 1.1;
  margin: 10px 0 14px;
}

.soon__text {
  color: var(--ink-soft);
  margin-bottom: 28px;
}

@keyframes fade {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* ---------- Footer ---------- */
.site-footer {
  background: var(--maroon);
  color: var(--cream);
  margin-top: 0 !important;
  /* margin-top: clamp(60px, 7vw, 160px); */
}

[data-theme="dark"] .site-footer {
  background: #11030a;
  border-top: 1px solid var(--line);
  color: #FFF1DC;
}

.site-footer__inner {
  max-width: 2000px;
  margin-inline: auto;
  padding: clamp(60px, 9vw, 184px) var(--gutter) 0;
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(20px, 3vw, 60px);
  align-items: start;
}

.site-footer .brand__title {
  font-size: 2.05rem;
}

.site-footer .brand__tag {
  font-size: .68rem;
}

.site-footer .brand__rule {
  height: 100px;
  background: var(--cream);
}

.site-footer .brand__emblem {
  width: 58px;
  height: 68px;
}

.site-footer .brand__ministry-text {
  font-size: .98rem;
}

.site-footer .brand__ministry-text [lang="hi"] {
  font-size: 1.02rem;
}

.site-footer .brand__ministry-text strong {
  font-size: 1.45rem;
}

.footer-nav {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: clamp(16px, 2.4vw, 50px);
  padding-top: 4px;
}

.footer-col h2 {
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 1.05rem;
  text-transform: uppercase;
  letter-spacing: .01em;
  margin-bottom: 12px;
}

.footer-col h2 a {
  text-decoration: none;
}

.footer-col li {
  margin-bottom: 5px;
}

.footer-col ul a {
  text-decoration: none;
  font-size: .96rem;
  position: relative;
  display: inline-block;
  padding-block: 2px;
}

.footer-col ul a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 1px;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .45s var(--ease);
}

.footer-col a:hover::after,
.footer-col a:focus-visible::after {
  transform: scaleX(1);
}

.footer-col h2 a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.footer-base {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: clamp(24px, 4vw, 90px);
  flex-wrap: wrap;
  margin-top: clamp(90px, 10vw, 140px);
  padding-block: 0 clamp(50px, 6vw, 70px);
}

.social {
  display: flex;
  gap: 6px;
  align-items: center;
  margin-left: -8px;
}

.social a {
  display: grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  color: var(--cream);
  transition: transform .4s var(--ease), color .3s;
}

.social a:hover {
  color: var(--pink);
  transform: translateY(-3px);
}

.copyright {
  font-size: .8rem;
  letter-spacing: .01em;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }

  .reveal,
  .reveal-line>span,
  .reveal-line>strong {
    opacity: 1 !important;
    transform: none !important;
  }

  .themes__curve path {
    stroke-dashoffset: 0 !important;
  }

  .hero__art,
  [data-parallax] {
    transform: none !important;
  }

  .menu-overlay {
    clip-path: none;
  }
}

html.reduce-motion *,
html.reduce-motion *::before,
html.reduce-motion *::after {
  animation: none !important;
  transition-duration: .01ms !important;
}

@media (forced-colors: active) {

  .btn-pass,
  .btn-outline,
  .menu-close {
    border: 2px solid ButtonText;
  }

  .theme__dot {
    border: 2px solid CanvasText;
  }
}

/* =====================================================================
   Venues: equal cards, equal 4:3 image boxes (10px radius), image never
   cropped (contain) with a blurred copy filling spare space, and the same
   calm hover as Our Team. Applies on desktop and mobile.
   ===================================================================== */
.venues .venues__grid .venue {
  margin-top: 0;
  margin-left: 0;
  margin-right: 0;
  display: flex;
  flex-direction: column;
}

.venues .venues__grid {
  align-items: stretch;
}

.venue__img-wrap {
  position: relative;
  /* aspect-ratio: 4 / 5; */
  border-radius: 12px;
  overflow: hidden;
  isolation: isolate;
  transition: transform 0.6s cubic-bezier(.16, 1, .3, 1), box-shadow 0.6s cubic-bezier(.16, 1, .3, 1);
}

.venue__img-wrap::before {
  content: '';
  position: absolute;
  inset: -12%;
  background: var(--img-bg) center / cover no-repeat;
  filter: blur(18px) saturate(1.05);
  opacity: 0.9;
  z-index: -1;
  transition: transform 1.2s cubic-bezier(.16, 1, .3, 1);
}

.venue__img-wrap::after {
  content: '';
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(255, 247, 233, 0.85);
  border-radius: 6px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.6s ease, inset 0.6s cubic-bezier(.16, 1, .3, 1);
}

.venues .venue .venue__img-wrap .venue__img {
  position: relative;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover !important;
  object-position: center;
  height: 230px;
}

.venue__info {
  flex: 1;
  align-items: flex-start;
}

.venue__name {
  transition: color 0.4s ease;
}

.explore-sec {
  padding: clamp(80px, 8vw, 120px) var(--gutter);
  overflow: hidden;
  box-sizing: border-box;
  background-color: var(--bg);
  padding-bottom: clamp(60px, 8vw, 100px);
}

.explore-sec__title {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 6vw, 6rem);
  font-weight: 300;
  color: var(--ink);
  margin: 0 0 clamp(40px, 6vw, 80px) 0;
  line-height: 1;
}

.explore-sec__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 2vw, 24px);
}

.explore-card {
  display: flex;
  flex-direction: column;
  background: transparent;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 12px;
  padding: 20px 16px;
  transition: all 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.explore-card:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 0, 0, 0.15);
}

.explore-card__img-wrap {
  width: 100%;
  margin-bottom: 20px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.explore-card__img {
  width: 100%;
  max-width: 200px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.06));
}

.explore-card__content {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  text-align: center;
}

.explore-card__name {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 2vw, 2.2rem);
  font-weight: 400;
  color: var(--pink);
  margin: 0 0 16px 0;
  line-height: 1.2;
}

.explore-card__desc {
  font-family: var(--font-ui);
  font-size: 0.95rem;
  color: var(--ink);
  opacity: 0.7;
  line-height: 1.6;
  margin: 0 0 24px 0;
  display: -webkit-box;
  -webkit-line-clamp: 10;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex-grow: 1;
}

.explore-card__cta {
  display: inline-block;
  font-family: var(--font-ui);
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--ink);
  text-decoration: none;
  padding: 10px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
  align-self: center;
}

.explore-card__cta:hover {
  color: var(--pink);
  border-bottom-color: var(--pink);
}

/* Dark Mode Overrides */
[data-theme="dark"] .explore-card {
  border-color: rgba(255, 255, 255, 0.1);
  background: transparent;
}

[data-theme="dark"] .explore-card:hover {
  border-color: rgba(255, 255, 255, 0.2);
}

[data-theme="dark"] .explore-card__cta {
  border-bottom-color: rgba(255, 255, 255, 0.3);
}

[data-theme="dark"] .explore-card__cta:hover {
  border-bottom-color: var(--pink);
}

@media (max-width: 1024px) {
  .explore-sec__grid {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 40px;
  }
}

@media (max-width: 600px) {
  .explore-sec__grid {
    grid-template-columns: 1fr;
  }
}

.intronew-fg {
  background: none !important;
}

@media (hover: hover) {
  .venue:hover .venue__img-wrap {
    transform: translateY(-6px);
    /* box-shadow: 0 20px 40px -22px rgba(26, 10, 16, 0.45); */
  }

  .venue:hover .venue__img-wrap::before {
    transform: scale(1.06);
  }

  .venue:hover .venue__img-wrap::after {
    opacity: 1;
    inset: 16px;
  }

  .venue:hover .venue__name {
    color: var(--accent);
  }
}

.venue:focus-within .venue__img-wrap {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px -22px rgba(26, 10, 16, 0.45);
}

@media (prefers-reduced-motion: reduce) {

  .venue__img-wrap,
  .venue__img-wrap::before {
    transition: none;
    transform: none !important;
  }
}

/* Intro (desktop): Images start and end exactly with the description text. */
@media (min-width: 1024px) {
  .intro .intro__fig--left {
    margin-left: 0;
    grid-row: 2;
    align-self: stretch;
    aspect-ratio: auto;
    margin-top: clamp(40px, 5vw, 90px);
  }

  .intro .intro__fig--right {
    grid-row: 2;
    align-self: stretch;
    aspect-ratio: auto;
    margin-top: clamp(40px, 5vw, 90px);
  }

  .intro .intro__body {
    grid-column: 4 / 10;
    justify-self: center;
  }
}

/* =====================================================================
   Header "Get Biennale Pass": ticket-inspired. Semicircle notches cut into
   both sides (mask), a fine dashed perforation inside the edge, gentle lift
   on hover. Existing maroon slide-up fill on hover is kept.
   ===================================================================== */
.site-header .btn-pass {
  --notch: 9px;
  border-radius: 8px;
  letter-spacing: 0.01em;
  -webkit-mask:
    radial-gradient(circle var(--notch) at 0 50%, transparent 98%, #000 100%) left / 51% 100% no-repeat,
    radial-gradient(circle var(--notch) at 100% 50%, transparent 98%, #000 100%) right / 51% 100% no-repeat;
  mask:
    radial-gradient(circle var(--notch) at 0 50%, transparent 98%, #000 100%) left / 51% 100% no-repeat,
    radial-gradient(circle var(--notch) at 100% 50%, transparent 98%, #000 100%) right / 51% 100% no-repeat;
  filter: drop-shadow(0 6px 14px rgba(250, 32, 127, 0.22));
  transition: transform .4s var(--ease), filter .4s var(--ease);
}

/* perforation: dashed line inset from the edge, broken at the notches */
.site-header .btn-pass::after {
  content: "";
  position: absolute;
  inset: 6px calc(var(--notch) + 5px);
  border: 1px dashed rgba(255, 255, 255, 0.55);
  border-radius: 4px;
  pointer-events: none;
  transition: border-color .4s var(--ease), inset .4s var(--ease);
}

.site-header .btn-pass:hover,
.site-header .btn-pass:focus-visible {
  transform: translateY(-2px);
  filter: drop-shadow(0 10px 18px rgba(115, 12, 57, 0.3));
}

.site-header .btn-pass:hover::after,
.site-header .btn-pass:focus-visible::after {
  border-color: rgba(255, 255, 255, 0.85);
  inset: 5px calc(var(--notch) + 4px);
}

@media (prefers-reduced-motion: reduce) {

  .site-header .btn-pass,
  .site-header .btn-pass::after {
    transition: none;
  }
}

/* =====================================================================
   Site-wide image hover: subtle dark overlay that fades in smoothly.
   Done with brightness on the image itself, so nothing is cropped,
   resized or re-laid-out. Decorative art, logos and patterns are excluded.
   ===================================================================== */
.iaadb-layout__main img {
  transition: filter 0.6s cubic-bezier(.22, .61, .36, 1);
}

@media (hover: hover) {

  .iaadb-layout__main img:not(.hero__art):not(.intro__tree):not(.coe-hero__art):not([aria-hidden="true"]):not([src*="logo"]):not([src*="ministry"]):not([src*="flower-pattern"]):not([src$="ab1.svg"]):hover,
  /* card-style blocks: darken when the whole card is hovered */
  .home-team__card:hover .home-team__img,
  .home-news__card:hover .home-news__img,
  .venue:hover .venue__img,
  .participant-card:hover .participant-card__img,
  .event:hover .event__img,
  .ab-committee__card:hover .ab-committee__img,
  .coe-row:hover .coe-row__img {
    filter: brightness(0.72);
  }
}

@media (prefers-reduced-motion: reduce) {
  .iaadb-layout__main img {
    transition: none;
  }
}

/* =====================================================================
   Image hover v2 (elegant): soft dark overlay + a fine white frame that
   eases in from the edge. Outline with negative offset is drawn inside the
   image box, so nothing is cropped and no extra markup is needed.
   Team/Venue already have their own inner frame on the wrapper.
   ===================================================================== */
.iaadb-layout__main img {
  outline: 1px solid rgba(255, 255, 255, 0);
  outline-offset: -6px;
  transition:
    filter 0.7s cubic-bezier(.22, .61, .36, 1),
    outline-color 0.7s cubic-bezier(.22, .61, .36, 1),
    outline-offset 0.7s cubic-bezier(.22, .61, .36, 1);
  object-fit: fill !important;
}

@media (hover: hover) {

  .iaadb-layout__main img:not(.hero__art):not(.intro__tree):not(.coe-hero__art):not([aria-hidden="true"]):not([src*="logo"]):not([src*="ministry"]):not([src*="flower-pattern"]):not([src$="ab1.svg"]):not(.home-team__img):not(.venue__img):hover,
  .home-news__card:hover .home-news__img,
  .participant-card:hover .participant-card__img,
  .event:hover .event__img,
  .ab-committee__card:hover .ab-committee__img,
  .coe-row:hover .coe-row__img {
    filter: brightness(0.7) contrast(1.05);
    outline-color: rgba(255, 255, 255, 0.85);
    outline-offset: -16px;
  }

  /* Team + Venue: same overlay; their wrapper already draws the white frame */
  .home-team__card:hover .home-team__img,
  .venue:hover .venue__img {
    filter: brightness(0.7) contrast(1.05);
  }
}

@media (prefers-reduced-motion: reduce) {
  .iaadb-layout__main img {
    transition: none;
  }
}

/* Curatorial premise text: own block so its small size gets its own line height
   (as an inline span it inherited the large paragraph's line box). */
.curatorial__text .curotorial-name {
  display: block;
  max-width: 34rem;
  margin: 24px auto 0 !important;
  padding-top: 0 !important;
  font-size: 17px !important;
  line-height: 1.5 !important;
}

@media (max-width: 639px) {
  .curatorial__text .curotorial-name {
    margin-top: 16px !important;
    font-size: 15px !important;
  }
}


/* --- animations.css --- */
/* ============================================
   INDIA BIENNALE — ANIMATIONS
   ============================================ */

/* Base reveal states */
.reveal {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 0.9s var(--ease), transform 0.9s var(--ease);
}

.reveal-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-50px);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.reveal-right {
  opacity: 0;
  transform: translateX(50px);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.reveal-scale {
  opacity: 0;
  transform: scale(0.92);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.reveal-image {
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1.2s var(--ease);
}

.reveal-image-left {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1.2s var(--ease);
}

.reveal-image-right {
  clip-path: inset(0 0 0 100%);
  transition: clip-path 1.2s var(--ease);
}

.reveal-line {
  width: 0;
  transition: width 1.2s var(--ease);
}

.reveal-fade {
  opacity: 0;
  transition: opacity 1s var(--ease);
}

/* Active states */
.reveal.visible,
.reveal-up.visible,
.reveal-left.visible,
.reveal-right.visible,
.reveal-scale.visible,
.reveal-fade.visible {
  opacity: 1;
  transform: translate(0, 0) scale(1);
}

.reveal-image.visible,
.reveal-image-left.visible,
.reveal-image-right.visible,
.voice-item.visible .reveal-image,
.voice-item.visible .reveal-image-left,
.voice-item.visible .reveal-image-right,
.voice-portrait.visible {
  clip-path: inset(0 0 0 0) !important;
}

.reveal-line.visible {
  width: var(--line-width, 100%);
}

/* Stagger items */
.stagger-item {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}

.stagger-item.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Word/line reveal for headings */
.word-reveal {
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
}

.word-reveal span {
  display: inline-block;
  transform: translateY(100%);
  transition: transform 0.8s var(--ease);
}

.word-reveal.visible span {
  transform: translateY(0);
}

/* Line reveal for headings */
.line-reveal {
  display: block;
  overflow: hidden;
}

.line-reveal .line-inner {
  display: block;
  transform: translateY(100%);
  transition: transform 0.9s var(--ease);
}

.line-reveal.visible .line-inner {
  transform: translateY(0);
}

/* Number reveal */
.number-reveal {
  opacity: 0;
  transform: translateY(40px) scale(0.9);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}

.number-reveal.visible {
  opacity: 0.85;
  transform: translateY(0) scale(1);
}

/* Shape animation */
.shape-reveal {
  opacity: 0;
  transform: scale(0.8) rotate(-5deg);
  transition: opacity 1s var(--ease), transform 1.2s var(--ease);
}

.shape-reveal.visible {
  opacity: var(--shape-opacity, 0.1);
  transform: scale(1) rotate(0);
}

/* Parallax */
.parallax {
  will-change: transform;
}

/* Hover transitions */
.hover-scale {
  transition: transform 0.6s var(--ease);
}

.hover-scale:hover {
  transform: scale(1.04);
}

/* Arrow slide */
.arrow-slide {
  display: inline-block;
  transition: transform 0.4s var(--ease);
}

.arrow-slide:hover {
  transform: translateX(8px);
}

/* Underline grow */
.underline-grow {
  position: relative;
}

.underline-grow::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--color-rust);
  transition: width 0.5s var(--ease);
}

.underline-grow:hover::after {
  width: 100%;
}

/* ============================================
   ANIMATIONS READY
   ============================================ */



/* --- page-section.css --- */
/* ── Dynamic Master Page Section Styles ── */
.master-page-section {
  min-height: 100vh;
  background-color: var(--color-cream, #F9F6F0);
}

/* Breadcrumb Navigation */
.master-page-breadcrumb {
  padding: 1.1rem var(--gutter, 2rem);
  border-bottom: 1px solid rgba(169, 71, 47, 0.12);
  background-color: rgba(249, 246, 240, 0.95);
}

.master-page-breadcrumb__container {
  max-width: var(--container, 1440px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #777777;
}

.master-page-breadcrumb__link {
  color: var(--color-rust, #A9472F);
  text-decoration: none;
  transition: color 0.3s ease;
}

.master-page-breadcrumb__link:hover {
  color: var(--color-ochre, #C68B59);
}

.master-page-breadcrumb__separator {
  opacity: 0.5;
}

.master-page-breadcrumb__current {
  color: #1D1D1B;
  font-weight: 600;
}

/* Main Content Area */
.master-page-content-section {
  padding: clamp(3rem, 6vw, 5rem) var(--gutter, 2rem);
}

.master-page-content-container {
  max-width: 960px;
  margin: 0 auto;
}

.master-page-editorial-text {
  font-family: var(--font-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(1.1rem, 2vw, 1.25rem);
  line-height: 1.85;
  color: #2b2927;
}

.master-page-editorial-text p {
  margin-bottom: 1.5rem;
}

.master-page-editorial-text h2,
.master-page-editorial-text h3 {
  font-family: var(--font-serif, "Playfair Display", Georgia, serif);
  color: var(--color-rust, #A9472F);
  margin-top: 2rem;
  margin-bottom: 1rem;
}

.master-page-editorial-text ul,
.master-page-editorial-text ol {
  margin-left: 1.5rem;
  margin-bottom: 1.5rem;
}

.master-page-editorial-text blockquote {
  border-left: 3px solid var(--color-rust, #A9472F);
  padding-left: 1.5rem;
  margin: 2rem 0;
  font-style: italic;
  color: #4a4742;
}

/* Fallback Notice */
.master-page-fallback-section {
  padding: clamp(4rem, 8vw, 6rem) var(--gutter, 2rem);
  text-align: center;
}

.master-page-fallback-container {
  max-width: 680px;
  margin: 0 auto;
}

.master-page-fallback-label {
  margin-bottom: 1rem;
}

.master-page-fallback-title {
  font-family: var(--font-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(1.8rem, 3.5vw, 2.5rem);
  color: var(--color-rust, #A9472F);
  margin-bottom: 1rem;
}

.master-page-fallback-desc {
  color: #555555;
  font-size: 1.05rem;
  line-height: 1.7;
}

/* Photo Gallery */
.master-page-gallery-section {
  background-color: #f2eae1;
  padding: clamp(4rem, 7vw, 6rem) var(--gutter, 2rem);
  border-top: 1px solid rgba(169, 71, 47, 0.12);
  border-bottom: 1px solid rgba(169, 71, 47, 0.12);
}

.master-page-gallery-container {
  max-width: var(--container, 1440px);
  margin: 0 auto;
}

.master-page-gallery-header {
  margin-bottom: 3rem;
}

.master-page-gallery-title {
  font-family: var(--font-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(2rem, 4vw, 3rem);
  color: var(--color-rust, #A9472F);
  margin: 0.5rem 0 0;
}

.master-page-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 2rem;
}

.master-page-gallery-item {
  position: relative;
  aspect-ratio: 4/3;
  border-radius: 2px;
  overflow: hidden;
  cursor: pointer;
  background-color: #e3dad0;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
}

.master-page-gallery-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.master-page-gallery-item:hover .master-page-gallery-img {
  transform: scale(1.05);
}

.master-page-gallery-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(29, 29, 27, 0.85) 0%, transparent 60%);
  display: flex;
  align-items: flex-end;
  padding: 1.25rem;
  color: #ffffff;
  font-size: 0.85rem;
  letter-spacing: 0.05em;
  font-weight: 500;
}

/* Documents / PDF Section */
.master-page-docs-section {
  padding: clamp(4rem, 6vw, 5rem) var(--gutter, 2rem);
}

.master-page-docs-container {
  max-width: 960px;
  margin: 0 auto;
}

.master-page-docs-header {
  margin-bottom: 2.5rem;
}

.master-page-docs-title {
  font-family: var(--font-serif, "Playfair Display", Georgia, serif);
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  color: var(--color-rust, #A9472F);
  margin: 0.5rem 0 0;
}

.master-page-doc-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 2rem 2.5rem;
  background-color: #ffffff;
  border: 1px solid rgba(169, 71, 47, 0.2);
  border-radius: 3px;
  box-shadow: 0 6px 24px rgba(169, 71, 47, 0.06);
}

.master-page-doc-info {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.master-page-doc-badge {
  width: 56px;
  height: 56px;
  border-radius: 6px;
  background-color: rgba(169, 71, 47, 0.08);
  color: var(--color-rust, #A9472F);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.master-page-doc-title {
  font-family: var(--font-serif, "Playfair Display", Georgia, serif);
  font-size: 1.3rem;
  color: #1D1D1B;
  margin-bottom: 0.25rem;
}

.master-page-doc-dates {
  margin: 0;
  font-size: 0.85rem;
  color: #666666;
}

.master-page-doc-btn {
  text-decoration: none;
}

/* Lightbox Modal */
.master-page-lightbox-backdrop {
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.92);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

.master-page-lightbox-close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  background: transparent;
  border: none;
  color: #ffffff;
  cursor: pointer;
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.master-page-lightbox-img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 2px;
}

/* Maintenance View */
.master-page-maintenance {
  padding: 4rem 1rem;
  text-align: center;
}

/* ── Dark theme: these sections use fixed light colours, so map them to the dark palette ── */
[data-theme="dark"] .master-page-section,
[data-theme="dark"] .master-page-gallery-section,
[data-theme="dark"] .master-page-doc-card {
  background-color: #16120E;
}

[data-theme="dark"] .master-page-breadcrumb {
  background-color: rgba(22, 18, 14, 0.95);
}

[data-theme="dark"] .master-page-doc-card {
  border-color: var(--line);
}

[data-theme="dark"] .master-page-breadcrumb__current,
[data-theme="dark"] .master-page-editorial-text,
[data-theme="dark"] .master-page-doc-title {
  color: var(--ink);
}

[data-theme="dark"] .master-page-breadcrumb__container,
[data-theme="dark"] .master-page-editorial-text blockquote,
[data-theme="dark"] .master-page-fallback-desc,
[data-theme="dark"] .master-page-doc-dates {
  color: var(--ink-soft);
}

/* --- FeaturedParticipantsSlider.css --- */
/* =====================================================================
   Featured Participants: infinite centre-focus slider.
   Cards are absolutely placed in 3 slots (left / center / right) and glide
   between them with transform transitions. Images are never cropped:
   full image inside an equal 4:3 box, blurred copy fills spare space.
   ===================================================================== */
.fps {
  --fps-ease: cubic-bezier(.65, 0, .35, 1);
  --fps-dur: 0.9s;
  --fps-center-w: 44%;
  --fps-side-shift: 74%;
  /* how far side cards sit from the centre (of card width) */
  --fps-side-scale: 0.72;
  max-width: 1400px;
  margin: 0 auto;
}

.fps__stage {
  position: relative;
  /* height = centre card (4:3 image) + name line */
  height: calc((min(100vw - 2 * var(--gutter), 1400px) * 0.44) * 0.75 + 5rem);
  overflow: hidden;
  touch-action: pan-y;
}
.exd2-subtitle{
  display : none;
}
.fps__card {
  position: absolute;
  top: 0;
  left: 50%;
  width: var(--fps-center-w);
  margin-left: calc(var(--fps-center-w) / -2);
  transform-origin: center top;
  transition:
    transform var(--fps-dur) var(--fps-ease),
    opacity var(--fps-dur) var(--fps-ease),
    filter var(--fps-dur) var(--fps-ease);
  will-change: transform, opacity;
  cursor: pointer;
  text-align: center;
}

.fps__card--center {
  transform: translateX(0) scale(1);
  opacity: 1;
  z-index: 3;
  cursor: default;
}

.fps__card--left {
  transform: translateX(calc(var(--fps-side-shift) * -1)) translateY(8%) scale(var(--fps-side-scale));
  opacity: 0.55;
  filter: saturate(0.75);
  z-index: 2;
}

.fps__card--right {
  transform: translateX(var(--fps-side-shift)) translateY(8%) scale(var(--fps-side-scale));
  opacity: 0.55;
  filter: saturate(0.75);
  z-index: 2;
}

.fps__card--far-left {
  transform: translateX(calc(var(--fps-side-shift) * -2)) translateY(8%) scale(0.6);
  opacity: 0;
  z-index: 1;
  pointer-events: none;
}

.fps__card--far-right {
  transform: translateX(calc(var(--fps-side-shift) * 2)) translateY(8%) scale(0.6);
  opacity: 0;
  z-index: 1;
  pointer-events: none;
}

/* loop wrap: jump instantly to the other side, then fade in (no sweep across the centre) */
.fps__card.is-wrapping {
  transition: opacity var(--fps-dur) var(--fps-ease), filter var(--fps-dur) var(--fps-ease);
  animation: fps-wrap-in var(--fps-dur) var(--fps-ease);
}

@keyframes fps-wrap-in {
  from {
    opacity: 0;
  }
}

.fps__card:not(.fps__card--center):hover {
  opacity: 0.8;
}

.fps__img-wrap {
  position: relative;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  overflow: hidden;
  isolation: isolate;
  transition: box-shadow var(--fps-dur) var(--fps-ease);
}

.fps__img-wrap::before {
  content: '';
  position: absolute;
  inset: -12%;
  background: var(--img-bg) center / cover no-repeat;
  filter: blur(18px);
  opacity: 0.9;
  z-index: -1;
}

.fps__card--center .fps__img-wrap {
  box-shadow: 0 30px 60px -30px rgba(26, 10, 16, 0.55);
}

/* fine white frame on the focused card */
.fps__img-wrap::after {
  content: '';
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(255, 255, 255, 0);
  border-radius: 6px;
  transition: border-color var(--fps-dur) var(--fps-ease);
  pointer-events: none;
}

.fps__card--center .fps__img-wrap::after {
  border-color: rgba(255, 255, 255, 0.75);
}

.fps__img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  user-select: none;
}

.fps__name {
  margin: 1.1rem 0 0;
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 1.6vw, 1.6rem);
  font-weight: 400;
  color: var(--ink);
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.6s ease 0.25s, transform 0.6s var(--fps-ease) 0.25s;
}

.fps__card--center .fps__name {
  opacity: 1;
  transform: none;
}

/* ---------- Controls: counter + progress (left), arrows (right) ---------- */
.fps__controls {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding-top: 1.25rem;
  border-top: 1px solid var(--line);
}

.fps__count {
  font-family: var(--font-display);
  font-size: 1.3rem;
  color: var(--ink);
  white-space: nowrap;
}

.fps__count span {
  color: var(--ink-soft);
  font-size: 0.95rem;
}

.fps__progress {
  flex: 1;
  height: 1px;
  background: var(--line);
  overflow: hidden;
}

.fps__progress span {
  display: block;
  height: 100%;
  background: var(--accent);
  transform-origin: left;
  animation: fps-progress 5s linear forwards;
}

.fps__progress span.is-paused {
  animation-play-state: paused;
}

@keyframes fps-progress {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

.fps__arrows {
  display: flex;
  gap: 0.75rem;
  margin-left: auto;
}

.fps__arrow {
  display: grid;
  place-items: center;
  width: 3.25rem;
  height: 3.25rem;
  border: 1px solid var(--ink);
  border-radius: 999px;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, transform 0.35s var(--fps-ease);
}

.fps__arrow:hover,
.fps__arrow:focus-visible {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  transform: scale(1.06);
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  .fps {
    --fps-center-w: 72%;
    --fps-side-shift: 92%;
    --fps-side-scale: 0.8;
  }

  .fps__stage {
    height: calc(100vw * 0.72 * 0.75 + 5rem);
    margin-inline: calc(var(--gutter) * -1);
  }

  .fps__card--left,
  .fps__card--right {
    opacity: 0.45;
  }

  .fps__controls {
    gap: 1rem;
  }

  .fps__arrow {
    width: 2.75rem;
    height: 2.75rem;
  }
}

@media (prefers-reduced-motion: reduce) {

  .fps__card,
  .fps__name,
  .fps__img-wrap {
    transition: none;
  }

  .fps__progress {
    display: none;
  }
}

/* =====================================================================
   v2: arrows left/right in the same row, no divider/counter, no frame,
   no dark overlay; all three cards share the same clean look (centre is
   only larger). Click-only navigation.
   ===================================================================== */
.fps {
  display: flex;
  align-items: center;
  gap: clamp(0.75rem, 2vw, 2rem);
}

.fps__stage {
  flex: 1 1 auto;
  min-width: 0;
  height: calc((min(100vw - 2 * var(--gutter), 1400px) - 8rem) * 0.44 * 0.75 + 5rem);
}

.fps__arrow {
  flex: none;
  /* centre on the image, not on image + name */
  margin-bottom: 4rem;
  background: var(--bg);
}

/* same clean appearance on every card */
.fps__card--left,
.fps__card--right,
.fps__card:not(.fps__card--center):hover {
  opacity: 1;
  filter: none;
}

.fps__card--center .fps__img-wrap {
  box-shadow: 0 24px 50px -32px rgba(26, 10, 16, 0.4);
}

.fps__img-wrap::after,
.fps__card--center .fps__img-wrap::after {
  display: none;
}

/* exclude from the site-wide image hover (no dark overlay, no frame) */
.iaadb-layout__main .fps .fps__img,
.iaadb-layout__main .fps .fps__img:hover {
  filter: none !important;
  outline: none !important;
}

@media (max-width: 767px) {
  .fps {
    gap: 0.5rem;
  }

  .fps__stage {
    height: calc((100vw - 2 * var(--gutter) - 6rem) * 0.72 * 0.75 + 4.5rem);
    margin-inline: 0;
  }

  .fps__arrow {
    width: 2.5rem;
    height: 2.5rem;
    margin-bottom: 3.5rem;
  }
}

/* =====================================================================
   v3 smoothness: longer, softer easing; cards scale from the middle;
   the card that wraps round the loop glides in from beyond the edge.
   ===================================================================== */
.fps {
  --fps-ease: cubic-bezier(.22, 1, .36, 1);
  /* soft ease-out */
  --fps-dur: 1.1s;
}

.fps__card {
  transform-origin: center center;
  backface-visibility: hidden;
  transition:
    transform var(--fps-dur) var(--fps-ease),
    opacity calc(var(--fps-dur) * 0.8) ease;
}

.fps__card--left {
  transform: translateX(calc(var(--fps-side-shift) * -1)) translateY(6%) scale(var(--fps-side-scale));
}

.fps__card--right {
  transform: translateX(var(--fps-side-shift)) translateY(6%) scale(var(--fps-side-scale));
}

.fps__img-wrap {
  transition: box-shadow var(--fps-dur) var(--fps-ease);
}

.fps__name {
  transition: opacity 0.7s ease 0.35s, transform 0.9s var(--fps-ease) 0.3s;
}

/* loop wrap: glide in from just past the edge instead of popping in */
.fps__card--right.is-wrapping {
  transition: none;
  animation: fps-wrap-right var(--fps-dur) var(--fps-ease) both;
}

.fps__card--left.is-wrapping {
  transition: none;
  animation: fps-wrap-left var(--fps-dur) var(--fps-ease) both;
}

@keyframes fps-wrap-right {
  from {
    transform: translateX(calc(var(--fps-side-shift) * 1.9)) translateY(6%) scale(calc(var(--fps-side-scale) * 0.9));
    opacity: 0;
  }

  to {
    transform: translateX(var(--fps-side-shift)) translateY(6%) scale(var(--fps-side-scale));
    opacity: 1;
  }
}

@keyframes fps-wrap-left {
  from {
    transform: translateX(calc(var(--fps-side-shift) * -1.9)) translateY(6%) scale(calc(var(--fps-side-scale) * 0.9));
    opacity: 0;
  }

  to {
    transform: translateX(calc(var(--fps-side-shift) * -1)) translateY(6%) scale(var(--fps-side-scale));
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {

  .fps__card,
  .fps__card.is-wrapping {
    transition: none;
    animation: none;
  }
}

/* =====================================================================
   v4: left/right cards softly blurred, centre sharp. Blur eases in/out
   together with the slide so focus shifts smoothly to the new centre.
   ===================================================================== */
.fps__card {
  filter: blur(0);
  transition:
    transform var(--fps-dur) var(--fps-ease),
    opacity calc(var(--fps-dur) * 0.8) ease,
    filter var(--fps-dur) var(--fps-ease);
}

.fps__card--left,
.fps__card--right {
  filter: blur(3px);
  opacity: 0.85;
}

.fps__card--center {
  filter: blur(0);
  opacity: 1;
}

/* hovering a side card sharpens it a little, hinting it is clickable */
@media (hover: hover) {

  .fps__card--left:hover,
  .fps__card--right:hover {
    filter: blur(1.5px);
    opacity: 0.95;
  }
}

@media (max-width: 767px) {

  .fps__card--left,
  .fps__card--right {
    filter: blur(2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .fps__card {
    transition: none;
  }
}

/* =====================================================================
   Mobile v2: one focused image, full width. Neighbours wait off-screen
   and slide in; arrows float over the image edges.
   ===================================================================== */
@media (max-width: 767px) {
  .fps {
    position: relative;
    display: block;
    --fps-center-w: 100%;
    --fps-side-shift: 108%;
    --fps-side-scale: 0.92;
  }

  .fps__stage {
    height: calc((100vw - 2 * var(--gutter)) * 0.75 + 4rem);
    margin-inline: 0;
  }

  .fps__card--left,
  .fps__card--right,
  .fps__card--far-left,
  .fps__card--far-right {
    opacity: 0;
    filter: none;
    pointer-events: none;
  }

  .fps__card--left {
    transform: translateX(calc(var(--fps-side-shift) * -1)) scale(var(--fps-side-scale));
  }

  .fps__card--right {
    transform: translateX(var(--fps-side-shift)) scale(var(--fps-side-scale));
  }

  @keyframes fps-wrap-right {
    from {
      transform: translateX(var(--fps-side-shift)) scale(var(--fps-side-scale));
      opacity: 0;
    }

    to {
      transform: translateX(var(--fps-side-shift)) scale(var(--fps-side-scale));
      opacity: 0;
    }
  }

  @keyframes fps-wrap-left {
    from {
      transform: translateX(calc(var(--fps-side-shift) * -1)) scale(var(--fps-side-scale));
      opacity: 0;
    }

    to {
      transform: translateX(calc(var(--fps-side-shift) * -1)) scale(var(--fps-side-scale));
      opacity: 0;
    }
  }

  .fps__arrow {
    position: absolute;
    /* vertical centre of the 4:3 image */
    top: calc((100vw - 2 * var(--gutter)) * 0.375);
    transform: translateY(-50%);
    z-index: 5;
    width: 2.6rem;
    height: 2.6rem;
    margin: 0;
    border-color: transparent;
    background: rgba(255, 249, 235, 0.92);
    box-shadow: 0 6px 18px -6px rgba(26, 10, 16, 0.35);
    backdrop-filter: blur(4px);
  }

  .fps__arrow--prev {
    left: 0.6rem;
  }

  .fps__arrow--next {
    right: 0.6rem;
  }

  .fps__arrow:hover,
  .fps__arrow:focus-visible {
    transform: translateY(-50%) scale(1.06);
  }

  .fps__name {
    font-size: 1.25rem;
  }
}

/* Mobile: room for names that wrap to 2–3 lines (image 4:3 + name block), no clipping */
@media (max-width: 767px) {
  .fps__stage {
    height: calc((100vw - 2 * var(--gutter)) * 0.75 + 8.5rem);
  }

  .fps__name {
    font-size: clamp(1.05rem, 5vw, 1.25rem);
    line-height: 1.3;
    padding-inline: 0.5rem;
    overflow-wrap: anywhere;
  }
}

/* Mobile: just enough room for a 2-line name, so "View All" sits close below */
@media (max-width: 767px) {
  .fps__stage {
    height: calc((100vw - 2 * var(--gutter)) * 0.75 + 5.25rem);
  }

  .featured-participants .featured-participants__cta {
    margin-top: 16px;
  }
}


/* --- HomeEvents.css --- */
/* Add specific styles for HomeEvents component here */


/* --- HomeLatestNews.css --- */
/* ---------- Latest News ---------- */
.home-news {
  padding: clamp(40px, 6vw, 80px) var(--gutter);
  background: var(--bg);
  color: var(--ink);
  /* padding-top : 0 !important; */
}

.home-news__title {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 8vw, 8rem);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0 0 clamp(36px, 5vw, 70px);
}

.home-news__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: clamp(14px, 1.6vw, 28px);
  row-gap: 48px;
  align-items: start;
  max-width: 1600px;
  margin: 0 auto;
}

.home-news__card {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.home-news__img-wrap {
  position: relative;
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  background-color: #f2ede4;
}

.home-news__card:nth-child(1) .home-news__img-wrap {
  aspect-ratio: 408 / 444;
}

.home-news__card:nth-child(2) .home-news__img-wrap {
  aspect-ratio: 407 / 297;
}

.home-news__card:nth-child(3) .home-news__img-wrap {
  aspect-ratio: 408 / 333;
}

.home-news__card:nth-child(4) .home-news__img-wrap {
  aspect-ratio: 408 / 444;
}

.home-news__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.home-news__body {
  margin-top: clamp(10px, 1.2vw, 18px);
}

.home-news__card:first-child .home-news__body {
  /* No date on the first card in the design; its title sits lower. */
  margin-top: clamp(24px, 2.6vw, 40px);
}

.home-news__date {
  font-family: var(--font-ui);
  font-size: clamp(0.62rem, 0.65vw, 0.78rem);
  color: var(--ink-soft);
  opacity: 0.75;
  margin: 0 0 8px;
}

.home-news__name {
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.25vw, 1.35rem);
  font-weight: 300;
  line-height: 1.3;
  color: var(--ink);
  margin: 0 0 10px;
  max-width: 85%;
}

.home-news__desc {
  font-family: var(--font-ui);
  font-size: clamp(0.72rem, 0.78vw, 0.92rem);
  line-height: 1.6;
  color: var(--ink-soft);
  margin: 0;
  max-width: 92%;
}

.home-news__cta {
  display: flex;
  justify-content: center;
  margin-top: clamp(20px, 2vw, 32px);
}

.home-news__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: clamp(140px, 12vw, 180px);
  min-height: 42px;
  padding: 0 28px;
  border: 1px solid var(--ink);
  color: var(--ink);
  border-radius: 10px;
  font-family: var(--font-ui);
  font-size: clamp(0.8rem, 0.85vw, 0.95rem);
  font-weight: 500;
  text-decoration: none;
  transition: background-color .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease);
}

.home-news__btn:hover,
.home-news__btn:focus-visible {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* Tablet: 2 x 2 */
@media (max-width: 900px) {
  .home-news__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(16px, 3vw, 28px);
  }

  .home-news__card:first-child .home-news__body {
    margin-top: clamp(10px, 1.2vw, 18px);
  }

  .home-news__name {
    font-size: 1.1rem;
    max-width: none;
  }

  .home-news__desc {
    font-size: 0.85rem;
    max-width: none;
  }

  .home-news__date {
    font-size: 0.75rem;
  }

  .home-news__cta {
    margin-top: 48px;
  }
}

/* Mobile: horizontal scroller (reference layout) */
@media (max-width: 639px) {
  .home-news {
    padding-block: 24px 64px;
  }
  .exd-hero{
    gap : 8px !important;
  }
.explore-sec{
  padding-top: 60px !important;
}
  .home-news__title {
    font-size: clamp(2.6rem, 13.5vw, 3.4rem);
    margin-bottom: 24px;
  }

  .home-news__grid {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    max-width: none;
    margin-inline: calc(var(--gutter) * -1);
    padding-inline: var(--gutter);
    scroll-padding-inline: var(--gutter);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .home-news__grid::-webkit-scrollbar {
    display: none;
  }

  .home-news__card {
    flex: 0 0 72%;
    scroll-snap-align: start;
  }

  .home-news__card:first-child .home-news__body,
  .home-news__body {
    margin-top: 12px;
  }

  .home-news__name {
    font-family: var(--font-display);
    font-size: clamp(1.15rem, 5.6vw, 1.4rem);
    font-weight: 400;
    max-width: none;
  }

  .home-news__desc {
    font-size: .82rem;
    max-width: none;
  }

  .home-news__cta {
    margin-top: 32px;
  }

  .home-news__btn {
    width: auto;
    min-width: 0;
    min-height: 52px;
    padding: 0 28px;
    font-size: .95rem;
    border-color: var(--ink-soft);
  }
}

/* =====================================================================
   Equal image height, never cropped or stretched.
   Card width is proportional to the image's real aspect ratio (--ar),
   so with width:100% / height:auto every image ends up the same height.
   ===================================================================== */
.home-news .home-news__card .home-news__img-wrap {
  aspect-ratio: auto;
  overflow: visible;
  background-color: transparent;
}

.home-news .home-news__img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.home-news .home-news__card:first-child .home-news__body {
  margin-top: clamp(10px, 1.2vw, 18px);
}

/* Tablet + desktop: one row, widths in proportion to the images */
@media (min-width: 640px) {
  .home-news .home-news__grid {
    display: flex;
    align-items: flex-start;
  }

  .home-news .home-news__card {
    flex: var(--ar, 1) 1 0;
    min-width: 0;
  }
}

/* Mobile swipe row: every image exactly the same height */
@media (max-width: 639px) {
  .home-news .home-news__card {
    flex: 0 0 auto;
    width: calc(var(--ar, 1) * min(56vw, 240px));
    max-width: 86vw;
  }
}

/* =====================================================================
   FINAL: equal width + equal height for every card, image never cut.
   Fixed square box per card; the whole image is fitted inside (contain).
   ===================================================================== */
.home-news .home-news__card .home-news__img-wrap {
  aspect-ratio: 1 / 1;
  background: transparent;
  overflow: hidden;
}

.home-news .home-news__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

@media (min-width: 640px) {
  .home-news .home-news__card {
    flex: 1 1 0;
  }
}

@media (max-width: 639px) {
  .home-news .home-news__card {
    flex: 0 0 72%;
    width: auto;
    max-width: none;
  }
}

/* Equal-size box filled by a blurred copy of the image; the real image sits on top, uncropped */
.home-news .home-news__card .home-news__img-wrap {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  isolation: isolate;
}

.home-news .home-news__card .home-news__img-wrap::before {
  content: '';
  position: absolute;
  inset: -12%;
  background: var(--img-bg) center / cover no-repeat;
  filter: blur(18px) saturate(1.05);
  opacity: 0.9;
  z-index: -1;
}

.home-news .home-news__img {
  position: relative;
  object-position: center;
}


/* --- HomeMediaCoverage.css --- */
/* Add specific styles for HomeMediaCoverage component here */


/* --- HomePartners.css --- */
.partners-section {
  padding: 8rem 0;
  background-color: var(--bg-primary);
  border-top: 1px solid rgba(169, 71, 47, 0.1);
  position: relative;
  overflow: hidden;
}

.partners-section .section-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 4rem;
  padding: 0 5%;
}

/* ── Marquee outer wrapper ──────────────────────────────── */
.partners-marquee-outer {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* Fade edges */
.partners-marquee-fade-left,
.partners-marquee-fade-right {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 12%;
  z-index: 2;
  pointer-events: none;
}

.partners-marquee-fade-left {
  left: 0;
  background: linear-gradient(to right, var(--bg-primary) 0%, transparent 100%);
}

.partners-marquee-fade-right {
  right: 0;
  background: linear-gradient(to left, var(--bg-primary) 0%, transparent 100%);
}

/* ── Scrolling track ───────────────────────────────────── */
.partners-marquee-track {
  display: flex;
  width: max-content;
  animation: partners-scroll 28s linear infinite;
}

.partners-marquee-track:hover {
  animation-play-state: paused;
}

@keyframes partners-scroll {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

/* ── Each group = one full set of cards ────────────────── */
.partners-marquee-group {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 1.5rem;
  padding: 0 0.75rem;
}

/* ── Single partner card ───────────────────────────────── */
.partner-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  /* width: 180px; */
  padding: 2rem 1.5rem;
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(169, 71, 47, 0.12);
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}

.partner-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, rgba(169, 71, 47, 0.07) 0%, transparent 70%);
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}

.partner-card:hover {
  transform: translateY(-4px);
  border-color: rgba(169, 71, 47, 0.35);
  background: rgba(255, 255, 255, 0.05);
}

.partner-card:hover::before {
  opacity: 1;
}

/* ── Logo ──────────────────────────────────────────────── */
.partner-logo-wrap {
  width: 100%;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
}

.partner-logo {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  opacity: 0.75;
  filter: grayscale(100%) brightness(1.3);
  transition: all 0.35s ease;
}

.partner-card:hover .partner-logo {
  opacity: 1;
  filter: grayscale(0%) brightness(1);
}

.partner-name-fallback {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1rem;
  font-weight: 500;
  color: var(--text-primary);
  text-align: center;
  letter-spacing: -0.02em;
  line-height: 1.3;
}

.partner-name {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-secondary);
  text-align: center;
  opacity: 0.65;
  transition: opacity 0.3s ease, color 0.3s ease;
  margin-top: auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.partner-card:hover .partner-name {
  opacity: 1;
  color: var(--accent-orange);
}

/* ── Reduced motion ────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .partners-marquee-track {
    animation: none;
  }
}

@media (max-width: 768px) {
  .partners-section {
    padding: 5rem 0;
  }

  .partner-card {
    width: 140px;
    padding: 1.5rem 1rem;
  }

  .partner-logo-wrap {
    height: 50px;
    margin-bottom: 0.75rem;
  }
}

/* --- HomeSocial.css --- */
/* Add specific styles for HomeSocial component here */


/* --- HomeTeam.css --- */
/* ---------- Our Team / Curatorium ---------- */
.home-team {
  padding: clamp(60px, 8vw, 120px) var(--gutter);
  background: var(--bg);
  color: var(--ink);
  text-align: center;
}

.home-team__title {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 8vw, 8rem);
  font-weight: 300;
  line-height: 0.9;
  letter-spacing: -0.02em;
  color: var(--ink);
  margin: 0;
}

.home-team__title em,
.home-team__title span {
  display: block;
}

.home-team__title em {
  font-style: italic;
}

.home-team__subtitle {
  font-family: var(--font-ui);
  font-size: clamp(1.6rem, 3vw, 3rem);
  font-weight: 300;
  line-height: 1.2;
  color: var(--ink);
  margin: clamp(30px, 4.5vw, 70px) 0 clamp(30px, 4vw, 60px);
  margin-top: 20px;
}

/* Columns are proportional to each image's intrinsic width, so all
   images share one scale: square-ish ones sit shorter, portraits taller. */
.home-team__row {
  display: grid;
  grid-template-columns:
    minmax(0, 371fr) minmax(0, 551fr) minmax(0, 553fr) minmax(0, 346fr);
  grid-template-rows: auto auto auto;
  column-gap: clamp(10px, 1.4vw, 24px);
  max-width: 1600px;
  margin: 0 auto;
  text-align: left;
}

.home-team__card {
  display: grid;
  grid-row: span 3;
  grid-template-rows: subgrid;
  align-content: start;
  min-width: 0;
}

.home-team__name {
  font-family: var(--font-ui);
  font-size: clamp(0.8rem, 1.05vw, 1.1rem);
  font-weight: 400;
  line-height: 1.3;
  color: var(--ink);
  margin: 0 0 clamp(8px, 1vw, 16px);
  align-self: end;
}

.home-team__img-wrap {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: #f2ede4;
}

.home-team__card:nth-child(1) .home-team__img-wrap {
  aspect-ratio: 371 / 556;
}

.home-team__card:nth-child(2) .home-team__img-wrap {
  aspect-ratio: 551 / 684;
}

.home-team__card:nth-child(3) .home-team__img-wrap {
  aspect-ratio: 553 / 556;
}

.home-team__card:nth-child(4) .home-team__img-wrap {
  aspect-ratio: 346 / 684;
}

.home-team__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Never crop a photo: the box takes the image's own shape (works for any CMS image,
   e.g. pp.png is 417x474, not the 346x684 slot). Overrides the fixed per-card ratios above. */
.home-team .home-team__card .home-team__img-wrap {
  aspect-ratio: auto;
  background-color: transparent;
  border-radius: 10px;
}

.home-team .home-team__img {
  height: auto;
  object-fit: contain;
}

/* Desktop: role sits directly under its own photo (no shared row = no big gaps).
   Names keep a 2-line slot, bottom-aligned, so all photos still start on one line. */
@media (min-width: 901px) {
  .home-team .home-team__row {
    grid-template-rows: none;
    align-items: start;
  }

  .home-team .home-team__card {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }

  .home-team .home-team__name {
    display: flex;
    align-items: flex-end;
    min-height: 2.6em;
    /* 2 lines at line-height 1.3 */
    align-self: stretch;
    /* base rule's align-self:end would push names right in flex */
  }
}

.home-team__role {
  font-family: var(--font-ui);
  font-size: clamp(1rem, 0.7vw, 0.8rem);
  line-height: 1.45;
  color: var(--ink-soft);
  margin: clamp(10px, 1.2vw, 18px) 0 0;
  /* display : none; */
}

.home-team__role span {
  display: block;
}

.home-team__cta {
  display: flex;
  justify-content: center;
  margin-top: clamp(30px, 4vw, 60px);
}

.home-team__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 clamp(26px, 3vw, 44px);
  border: 1px solid var(--ink-soft);
  color: var(--ink);
  border-radius: 10px;
  font-family: var(--font-ui);
  font-size: clamp(0.72rem, 0.8vw, 0.9rem);
  font-weight: 500;
  text-decoration: none;
  transition: background-color .4s var(--ease), color .4s var(--ease), border-color .4s var(--ease);
}

.home-team__btn:hover,
.home-team__btn:focus-visible {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* Tablet: 2 x 2 */
@media (max-width: 900px) {
  .home-team__row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    column-gap: clamp(16px, 3vw, 28px);
    row-gap: 40px;
    max-width: 720px;
  }

  .home-team__card {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }

  .home-team__name {
    font-size: 0.95rem;
  }

  .home-team__role {
    font-size: 0.75rem;
  }
}

/* Mobile: horizontal scroller, name above image (reference layout) */
@media (max-width: 639px) {
  .home-team {
    padding-block: 64px 56px;
  }

  .home-team__title {
    font-size: clamp(2.8rem, 15vw, 3.8rem);
  }

  .home-team__subtitle {
    font-family: var(--font-display);
    font-size: clamp(1.4rem, 6.6vw, 1.8rem);
    margin: 8px 0 28px;
  }

  .home-team__row {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    max-width: none;
    margin-inline: calc(var(--gutter) * -1);
    padding-inline: var(--gutter);
    scroll-padding-inline: var(--gutter);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .home-team__row::-webkit-scrollbar {
    display: none;
  }

  .home-team__card {
    flex: 0 0 67%;
    display: flex;
    flex-direction: column;
    scroll-snap-align: start;
  }

  .home-team__name {
    font-family: var(--font-display);
    font-size: clamp(1.05rem, 4.9vw, 1.25rem);
    font-weight: 500;
    line-height: 1.25;
    margin: 0 0 14px;
    align-self: auto;
  }

  .home-team__role {
    font-size: .8rem;
  }

  .home-team__cta {
    margin-top: 40px;
  }

  .home-team__btn {
    min-height: 52px;
    padding: 0 28px;
    font-size: 1rem;
  }
}

/* =====================================================================
   Equal photo height, never cropped or stretched.
   Each card's width is proportional to its photo's aspect ratio (--ar, set
   from the real image), so with width:100% / height:auto every photo ends
   up the same height and fully visible.
   ===================================================================== */
.home-team .home-team__card .home-team__img-wrap {
  aspect-ratio: auto;
  overflow: visible;
}

.home-team .home-team__img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* Tablet + desktop: one row, widths in proportion to the photos */
@media (min-width: 640px) {
  .home-team .home-team__row {
    display: flex;
    align-items: flex-start;
    grid-template-columns: none;
    max-width: 1600px;
  }

  .home-team .home-team__card {
    display: flex;
    flex-direction: column;
    flex: var(--ar, 0.75) 1 0;
    min-width: 0;
    grid-row: auto;
  }

  .home-team .home-team__name {
    display: flex;
    align-items: flex-end;
    min-height: 2.6em;
    align-self: stretch;
  }
}

/* Mobile swipe row: every photo exactly the same height */
@media (max-width: 639px) {
  .home-team .home-team__card {
    flex: 0 0 auto;
    width: calc(var(--ar, 0.75) * min(78vw, 340px));
  }

  .home-team .home-team__name {
    min-height: 2.5em;
    display: flex;
    align-items: flex-end;
  }
}

/* "Our Team" on one line */
.home-team .home-team__title em,
.home-team .home-team__title span {
  display: inline;
}

.home-team .home-team__title em::after {
  content: ' ';
}

/* =====================================================================
   FINAL: equal width + equal height for every member, image never cut.
   Fixed 4:5 box per card; the whole photo is fitted inside (contain),
   any spare space blends into the page background.
   ===================================================================== */
.home-team .home-team__card .home-team__img-wrap {
  aspect-ratio: 4 / 5;
  background: transparent;
  overflow: hidden;
}

.home-team .home-team__img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
}

@media (min-width: 640px) {
  .home-team .home-team__card {
    flex: 1 1 0;
  }
}

@media (max-width: 639px) {
  .home-team .home-team__card {
    flex: 0 0 67%;
    width: auto;
  }
}

/* Equal-size box filled by a blurred copy of the photo; the real photo sits on top, uncropped */
.home-team .home-team__card .home-team__img-wrap {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  isolation: isolate;
}

.home-team .home-team__card .home-team__img-wrap::before {
  content: '';
  position: absolute;
  inset: -12%;
  background: var(--img-bg) center / cover no-repeat;
  filter: blur(18px) saturate(1.05);
  opacity: 0.9;
  z-index: -1;
}

.home-team .home-team__img {
  position: relative;
  object-position: center;
}

/* =====================================================================
   Hover: subtle lift + soft shadow, blurred backdrop drifts, name and
   role pick up the accent. The photo itself is never scaled, so it
   stays completely uncropped.
   ===================================================================== */
.home-team .home-team__card .home-team__img-wrap {
  transition: transform 0.6s cubic-bezier(.22, .61, .36, 1), box-shadow 0.6s cubic-bezier(.22, .61, .36, 1);
}

.home-team .home-team__card .home-team__img-wrap::before {
  transition: transform 1.2s cubic-bezier(.22, .61, .36, 1), opacity 0.6s ease;
}

.home-team .home-team__card .home-team__img-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(26, 10, 16, 0.18), transparent 45%);
  opacity: 0;
  transition: opacity 0.6s ease;
  pointer-events: none;
}

.home-team .home-team__name,
.home-team .home-team__role {
  transition: color 0.4s ease, transform 0.6s cubic-bezier(.22, .61, .36, 1);
}

@media (hover: hover) {
  .home-team .home-team__card:hover .home-team__img-wrap {
    transform: translateY(-8px);
    box-shadow: 0 18px 40px -18px rgba(26, 10, 16, 0.45);
  }

  .home-team .home-team__card:hover .home-team__img-wrap::before {
    transform: scale(1.08);
  }

  .home-team .home-team__card:hover .home-team__img-wrap::after {
    opacity: 1;
  }

  .home-team .home-team__card:hover .home-team__name {
    color: var(--accent);
  }

  .home-team .home-team__card:hover .home-team__role {
    transform: translateY(-4px);
  }
}

/* Keyboard users get the same lift when tabbing into a card */
.home-team .home-team__card:focus-within .home-team__img-wrap {
  transform: translateY(-8px);
  box-shadow: 0 18px 40px -18px rgba(26, 10, 16, 0.45);
}

@media (prefers-reduced-motion: reduce) {

  .home-team .home-team__card .home-team__img-wrap,
  .home-team .home-team__card .home-team__img-wrap::before,
  .home-team .home-team__role {
    transition: none;
    transform: none !important;
  }
}

/* =====================================================================
   Hover v2 (refined): lift + layered shadow, light sweep across the photo,
   pink accent line drawn under the photo, underline grows under the name.
   The photo is never scaled, so it stays fully uncropped.
   ===================================================================== */
.home-team .home-team__card {
  --ease-premium: cubic-bezier(.16, 1, .3, 1);
  cursor: default;
}

.home-team .home-team__card .home-team__img-wrap {
  transition: transform 0.7s var(--ease-premium), box-shadow 0.7s var(--ease-premium);
}

/* light sweep (replaces the earlier bottom gradient) */
.home-team .home-team__card .home-team__img-wrap::after {
  inset: 0 auto 0 -60%;
  width: 45%;
  opacity: 1;
  background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.28) 50%, transparent 100%);
  transform: skewX(-12deg) translateX(0);
  transition: transform 0s;
  z-index: 2;
}

/* pink accent line under the photo */
.home-team .home-team__img-wrap {
  border-bottom: 0;
}

.home-team .home-team__card .home-team__img-wrap>img {
  z-index: 1;
}

.home-team .home-team__card::after {
  content: '';
  display: block;
  order: 2;
  height: 3px;
  margin-top: -3px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.7s var(--ease-premium);
  position: relative;
  z-index: 3;
}

.home-team .home-team__card .home-team__img-wrap {
  order: 1;
}

.home-team .home-team__card .home-team__name {
  order: 0;
}

.home-team .home-team__card .home-team__role {
  order: 3;
}

/* underline under the name */
.home-team .home-team__name {
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 1px;
  background-repeat: no-repeat;
  background-position: left calc(100% - 6px);
  transition: color 0.4s ease, background-size 0.6s var(--ease-premium);
}

@media (hover: hover) {
  .home-team .home-team__card:hover .home-team__img-wrap {
    transform: translateY(-10px);
    box-shadow:
      0 2px 6px rgba(26, 10, 16, 0.06),
      0 24px 48px -20px rgba(26, 10, 16, 0.5);
  }

  .home-team .home-team__card:hover .home-team__img-wrap::after {
    transform: skewX(-12deg) translateX(420%);
    transition: transform 1.1s var(--ease-premium);
  }

  .home-team .home-team__card:hover::after {
    transform: translateY(-10px) scaleX(1);
  }

  .home-team .home-team__card:hover .home-team__name {
    background-size: 100% 1px;
  }

  .home-team .home-team__card:hover .home-team__role {
    transform: translateY(-4px);
    color: var(--ink);
  }

  /* Other cards dim slightly so the hovered one stands out */
  .home-team .home-team__row:hover .home-team__card:not(:hover) .home-team__img-wrap {
    opacity: 0.72;
    filter: saturate(0.85);
  }

  .home-team .home-team__card .home-team__img-wrap {
    transition: transform 0.7s var(--ease-premium), box-shadow 0.7s var(--ease-premium), opacity 0.5s ease, filter 0.5s ease;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-team .home-team__card .home-team__img-wrap::after {
    display: none;
  }

  .home-team .home-team__card::after,
  .home-team .home-team__card .home-team__img-wrap {
    transition: none;
  }
}

/* Hover v2 fixes: underline sits below the name; light sweep runs once and fades out */
.home-team .home-team__name {
  padding-bottom: 6px;
  background-position: left bottom;
}

.home-team .home-team__card .home-team__img-wrap::after {
  opacity: 0;
  transform: skewX(-12deg) translateX(0);
  transition: none;
}

@keyframes home-team-sweep {
  0% {
    transform: skewX(-12deg) translateX(0);
    opacity: 0;
  }

  15% {
    opacity: 1;
  }

  100% {
    transform: skewX(-12deg) translateX(480%);
    opacity: 0;
  }
}

@media (hover: hover) {
  .home-team .home-team__card:hover .home-team__img-wrap::after {
    animation: home-team-sweep 1.1s cubic-bezier(.16, 1, .3, 1) 1 forwards;
    transition: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-team .home-team__card:hover .home-team__img-wrap::after {
    animation: none;
  }
}

/* =====================================================================
   Hover v3 (final, minimal): small lift + soft shadow, thin cream frame
   fades in inside the photo, name turns accent. Earlier sweep / accent
   line / underline / dimming are switched off.
   ===================================================================== */
.home-team .home-team__card::after {
  display: none;
}

.home-team .home-team__name {
  background-image: none;
  padding-bottom: 0;
}

.home-team .home-team__card .home-team__img-wrap::after {
  inset: 12px;
  width: auto;
  background: none;
  border: 1px solid rgba(255, 247, 233, 0.85);
  transform: none;
  opacity: 0;
  animation: none !important;
  transition: opacity 0.6s ease, inset 0.6s cubic-bezier(.16, 1, .3, 1);
}

.home-team .home-team__card .home-team__img-wrap {
  transition: transform 0.6s cubic-bezier(.16, 1, .3, 1), box-shadow 0.6s cubic-bezier(.16, 1, .3, 1);
}

@media (hover: hover) {
  .home-team .home-team__row:hover .home-team__card:not(:hover) .home-team__img-wrap {
    opacity: 1;
    filter: none;
  }

  .home-team .home-team__card:hover .home-team__img-wrap {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -22px rgba(26, 10, 16, 0.45);
  }

  .home-team .home-team__card:hover .home-team__img-wrap::after {
    opacity: 1;
    inset: 16px;
  }

  .home-team .home-team__card:hover .home-team__img-wrap::before {
    transform: scale(1.06);
  }

  .home-team .home-team__card:hover .home-team__name {
    color: var(--accent);
  }

  .home-team .home-team__card:hover .home-team__role {
    transform: none;
    color: var(--ink-soft);
  }
}


/* --- HomeVisitUs.css --- */
/* ---------- Visit Us ---------- */
.home-visit {
  padding: clamp(40px, 4vw, 70px) var(--gutter);
  background: var(--bg);
  color: var(--ink);
}

.home-visit__title {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 8vw, 8rem);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--ink);
  text-align: center;
  margin: 0 0 clamp(36px, 5vw, 70px);
}

.home-visit__title em {
  font-style: italic;
}

.home-visit__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(12px, 1.6vw, 20px);
  max-width: 1600px;
  margin: 0 auto;
  align-items: stretch;
}

/* Shared card title (Accessibility / Get the pass) */
.home-visit__card-title {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 2.8vw, 3rem);
  font-weight: 300;
  line-height: 1.05;
  color: #fff;
  margin: 0;
}

.home-visit__card-title em {
  font-style: italic;
}

/* ---- How to reach (left) ---- */
.home-visit__reach {
  border-radius: 4px;
  padding: clamp(20px, 2.4vw, 36px) clamp(14px, 1.2vw, 20px) clamp(14px, 1.2vw, 20px);
  color: #fff;
  background:
    radial-gradient(ellipse 60% 45% at 55% 6%, rgba(255, 190, 220, 0.85) 0%, rgba(255, 190, 220, 0) 100%),
    radial-gradient(ellipse 55% 55% at 0% 100%, rgba(60, 0, 20, 0.95) 0%, rgba(60, 0, 20, 0) 100%),
    radial-gradient(ellipse 40% 50% at 0% 25%, rgba(120, 6, 50, 0.9) 0%, rgba(120, 6, 50, 0) 100%),
    linear-gradient(160deg, #e0347f 0%, #f2559b 35%, #ff3f8d 70%, #ff2f7f 100%);
}

.home-visit__reach-title {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 2.3vw, 2.5rem);
  font-weight: 300;
  line-height: 1.15;
  color: #fff;
  margin: 0 0 clamp(14px, 1.4vw, 22px) clamp(2px, 0.3vw, 6px);
}

.home-visit__options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(8px, 0.9vw, 14px);
}

.home-visit__option {
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 4px;
  padding: clamp(10px, 1.1vw, 16px) clamp(10px, 1vw, 14px);
}

.home-visit__option h4 {
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.25vw, 1.35rem);
  font-weight: 700;
  line-height: 1.2;
  color: #fff;
  margin: 0 0 6px;
}

.home-visit__option p {
  font-family: var(--font-ui);
  font-size: clamp(0.68rem, 0.72vw, 0.85rem);
  line-height: 1.6;
  color: #fff;
  margin: 0;
  white-space: pre-line;
}

.home-visit__option p+p {
  margin-top: 1.2em;
}

/* ---- Right column ---- */
.home-visit__side {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.6vw, 20px);
  min-width: 0;
}

.home-visit__top {
  display: grid;
  grid-template-columns: minmax(0, 2.1fr) minmax(0, 1fr);
  gap: clamp(12px, 1.6vw, 20px);
  flex: 1 1 auto;
}

.home-visit__access {
  position: relative;
  border-radius: 4px;
  padding: clamp(14px, 1.4vw, 22px);
  min-height: clamp(160px, 15vw, 230px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  background:
    radial-gradient(ellipse 60% 70% at 70% 30%, rgba(255, 175, 210, 0.75) 0%, rgba(255, 175, 210, 0) 100%),
    radial-gradient(ellipse 50% 60% at 10% 100%, rgba(225, 20, 100, 0.8) 0%, rgba(225, 20, 100, 0) 100%),
    linear-gradient(135deg, #f04e95 0%, #f773ad 50%, #f2478f 100%);
}

.home-visit__access p {
  font-family: var(--font-ui);
  font-size: clamp(0.7rem, 0.75vw, 0.88rem);
  line-height: 1.45;
  color: #fff;
  margin: 0 0 0 auto;
  max-width: 54%;
}

.home-visit__pass {
  border-radius: 4px;
  padding: clamp(14px, 1.4vw, 22px) clamp(12px, 1.1vw, 18px);
  background: #e08c0b;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.home-visit__pass-date {
  font-family: var(--font-ui);
  font-size: clamp(0.72rem, 0.8vw, 0.95rem);
  line-height: 1.35;
  color: #fff;
  margin: clamp(10px, 1vw, 16px) 0 clamp(12px, 1.2vw, 20px);
}

.home-visit__pass-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 4px 12px;
  border: 1px solid rgba(255, 255, 255, 0.85);
  color: #fff;
  font-family: var(--font-ui);
  font-size: clamp(0.62rem, 0.65vw, 0.8rem);
  text-decoration: none;
  transition: background-color .4s var(--ease), color .4s var(--ease);
  border-radius: 10px;
}

.home-visit__pass-btn:hover,
.home-visit__pass-btn:focus-visible {
  background: #fff;
  color: #e08c0b;
}

/* Map: image keeps its own ratio; title is overlaid top-left */
.home-visit__map {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  background: #f3ece0;
}

.home-visit__map-img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.home-visit__map-title {
  position: absolute;
  top: 8%;
  left: 3%;
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 3vw, 3.2rem);
  font-weight: 300;
  line-height: 1;
  color: #1a0a10;
  margin: 0;
  pointer-events: none;
}

/* Tablet: stack the two columns */
@media (max-width: 1024px) {
  .home-visit__grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: 820px;
  }

  .home-visit__option h4 {
    font-size: 1.1rem;
  }

  .home-visit__option p {
    font-size: 0.82rem;
  }

  .home-visit__access p {
    font-size: 0.85rem;
  }

  .home-visit__pass-date {
    font-size: 0.85rem;
  }

  .home-visit__pass-btn {
    font-size: 0.78rem;
  }
}

/* Mobile (reference layout) */
@media (max-width: 639px) {
  .home-visit {
    padding-block: 40px 80px;
  }

  .home-visit__title {
    font-size: clamp(2.8rem, 14vw, 3.6rem);
    margin-bottom: 20px;
  }

  .home-visit__grid,
  .home-visit__side,
  .home-visit__top {
    gap: 16px;
  }

  .home-visit__reach {
    border-radius: 6px;
    padding: 28px 20px 24px;
    background: linear-gradient(180deg, #9a4266 0%, #c55e89 22%, #e8457f 48%, #c3165a 66%, #5a0a26 86%, #2a0010 100%);
  }

  .home-visit__reach-title {
    font-size: clamp(1.5rem, 7.2vw, 1.9rem);
    margin: 0 0 16px;
  }

  .home-visit__options {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .home-visit__option {
    border-color: rgba(255, 255, 255, .45);
    border-radius: 8px;
    padding: 18px 16px;
  }

  .home-visit__option h4 {
    font-size: 1.15rem;
    margin-bottom: 10px;
  }

  .home-visit__option p {
    font-size: .84rem;
    line-height: 1.7;
  }

  .home-visit__top {
    grid-template-columns: minmax(0, 1fr);
  }

  .home-visit__access {
    min-height: 0;
    border-radius: 6px;
    padding: 24px;
    gap: 12px;
    justify-content: flex-start;
  }

  /* One line "Accessibility Info" (the markup keeps a space before the br) */
  .home-visit__access .home-visit__card-title br {
    display: none;
  }

  .home-visit__access p {
    max-width: none;
    margin-left: 0;
    font-family: var(--font-display);
    font-size: clamp(1rem, 4.6vw, 1.15rem);
    font-weight: 300;
    line-height: 1.4;
  }

  .home-visit__card-title {
    font-size: clamp(1.9rem, 9vw, 2.4rem);
  }

  .home-visit__pass {
    border-radius: 6px;
    padding: 24px;
  }

  .home-visit__pass-date {
    font-size: .95rem;
    margin: 14px 0 20px;
  }

  .home-visit__pass-btn {
    min-height: 42px;
    padding: 0 14px;
    font-size: .95rem;
  }

  .home-visit__map {
    border-radius: 6px;
  }

  .home-visit__map-title {
    top: 9%;
    left: 6%;
    font-size: clamp(1.6rem, 8.6vw, 2.3rem);
  }
}

/* ---------- "How to reach" accordion (mobile only; desktop unchanged) ---------- */
.home-visit__option-toggle {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: default;
}

.home-visit__option-icon {
  display: none;
}

@media (max-width: 767px) {
  .home-visit__option {
    padding: 0;
  }

  .home-visit__option h4 {
    margin: 0;
  }

  .home-visit__option-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 18px 16px;
    cursor: pointer;
  }

  .home-visit__option-toggle:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
  }

  /* plus / minus drawn with two bars; the vertical bar collapses when open */
  .home-visit__option-icon {
    display: block;
    position: relative;
    flex: none;
    width: 18px;
    height: 18px;
  }

  .home-visit__option-icon::before,
  .home-visit__option-icon::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 16px;
    height: 2px;
    margin: -1px 0 0 -8px;
    border-radius: 2px;
    background: currentColor;
    transition: transform 0.35s ease, opacity 0.35s ease;
  }

  .home-visit__option-icon::after {
    transform: rotate(90deg);
  }

  .home-visit__option.is-open .home-visit__option-icon::after {
    transform: rotate(0deg);
    opacity: 0;
  }

  /* smooth height animation via grid rows */
  .home-visit__option-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.4s ease;
  }

  .home-visit__option-body>div {
    min-height: 0;
    overflow: hidden;
    padding: 0 16px;
    transition: padding 0.4s ease;
  }

  .home-visit__option.is-open .home-visit__option-body {
    grid-template-rows: 1fr;
  }

  .home-visit__option.is-open .home-visit__option-body>div {
    padding-bottom: 18px;
  }
}


/* --- HomeVoices.css --- */
/* Add specific styles for HomeVoices component here */


/* --- StaticFooter.css --- */
/* ---------- Footer (pink, fort backdrop) ---------- */
.site-footer.india-footer,
[data-theme="dark"] .site-footer.india-footer {
  --footer-pink: #c8105e;
  position: relative;
  overflow: hidden;
  background: var(--footer-pink);
  color: #fff;
  border-top: 0;
}

.india-footer__top {
  position: relative;
  z-index: 2;
  max-width: 2000px;
  margin-inline: auto;
  padding: clamp(40px, 4.5vw, 72px) var(--gutter) 0;
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  column-gap: clamp(20px, 3vw, 60px);
  align-items: start;
}

/* Brand (reuses .brand markup, sized to the reference) */
.india-footer .brand {
  color: #fff;
}

.india-footer .brand__title {
  font-size: clamp(1.3rem, 1.5vw, 1.8rem);
}

.india-footer .brand__tag {
  font-size: clamp(.5rem, .55vw, .65rem);
}

.india-footer .brand__rule {
  height: clamp(56px, 5.4vw, 84px);
  background: #fff;
}

.india-footer .brand__emblem {
  width: clamp(36px, 3.4vw, 52px);
  height: clamp(42px, 4vw, 60px);
}

.india-footer .brand__ministry-text {
  font-size: clamp(.68rem, .8vw, .9rem);
}

.india-footer .brand__ministry-text [lang="hi"] {
  font-size: clamp(.7rem, .82vw, .92rem);
}

.india-footer .brand__ministry-text strong {
  font-size: clamp(.95rem, 1.15vw, 1.3rem);
}

.india-footer__social {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  margin: clamp(20px, 2.4vw, 36px) 0 0 -10px;
  padding: 0;
}

.india-footer__social a {
  display: grid;
  place-items: center;
  min-width: 36px;
  min-height: 36px;
  color: #fff;
  transition: transform .4s var(--ease), opacity .3s;
}

.india-footer__social a:hover,
.india-footer__social a:focus-visible {
  opacity: .8;
  transform: translateY(-3px);
}

/* Link columns */
.india-footer__nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: clamp(16px, 2.4vw, 50px);
  row-gap: 32px;
}

.india-footer__col h2 {
  font-family: var(--font-ui);
  font-size: clamp(.78rem, .85vw, 1rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .01em;
  color: #fff;
  margin: 0 0 10px;
}

.india-footer__col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.india-footer__col li {
  margin-bottom: 3px;
}

.india-footer__col a {
  position: relative;
  display: inline-block;
  padding-block: 1px;
  font-family: var(--font-ui);
  font-size: clamp(1.0rem, .93vw, .94rem) !important;
  color: #fff;
  text-decoration: none;
}

.india-footer__col a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .45s var(--ease);
}

.india-footer__col a:hover::after,
.india-footer__col a:focus-visible::after {
  transform: scaleX(1);
}

/* Fort artwork + big wordmark */
.india-footer__art {
  /* No z-index here: a stacking context would isolate the img's
     mix-blend-mode from the pink background and darken it instead. */
  position: relative;
  /* Pull the (mostly black = invisible) sky up behind the link rows. */
  margin-top: calc(clamp(10px, 2vw, 30px) - 9vw);
  pointer-events: none;
}

.india-footer__bg {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  mix-blend-mode: screen;
  opacity: .32;
  filter: grayscale(1);
}

.india-footer__wordmark {
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(8px, 1.6vw, 28px);
  margin: 0;
  padding-inline: var(--gutter);
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 9.4vw, 14rem);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.01em;
  text-align: center;
  white-space: nowrap;
  color: #fff;
}

/* Laptop / tablet: brand above, links below */
@media (max-width: 1024px) {
  .india-footer__top {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 36px;
  }

  .india-footer__art {
    margin-top: calc(24px - 6vw);
  }
}

/* Mobile (reference layout): 2-col links over the fort, wordmark left under a rule */
@media (max-width: 639px) {
  .india-footer__top {
    padding-top: 48px;
    row-gap: 0;
  }
  .quitubimage{
    display : none;
  }

  .india-footer__social {
    gap: 14px;
    margin: 19px 0 0px -6px;
  }

  .india-footer__social svg {
    width: 26px;
    height: 26px;
  }

  .india-footer__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 32px;
  }

  .india-footer__col h2 {
    font-size: .9rem;
    margin-bottom: 14px;
  }

  .india-footer__col li {
    margin-bottom: 7px;
  }

  .india-footer__col a {
    font-size: 1rem;
  }

  /* Fort sits behind the lower link rows; image stays whole (width 100%, height auto). */
  .india-footer__art {
    margin-top: -26vw;
  }

  .india-footer__wordmark {
    position: static;
    margin: 12px var(--gutter) 0;
    padding: 28px 0 40px;
    border-top: 1px solid rgba(255, 255, 255, .35);
    font-size: clamp(2.4rem, 13.5vw, 4.4rem);
    line-height: 1.05;
    text-align: center;
    white-space: normal;
  }
}


/* --- about.css --- */
/* =====================================================================
   About Us page. Desktop first, then tablet (max 1023px) and mobile (max 639px).
   All images keep their natural aspect ratio (width set, height:auto): never cropped.
   ===================================================================== */
.ab {
  background: var(--bg);
  color: var(--ink);
  overflow-x: clip;
}

.ab img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ---------- Shared buttons ---------- */
.ab-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 0 34px;
  font-family: var(--font-ui);
  font-size: clamp(.85rem, .8vw, 1rem);
  font-weight: 600;
  text-decoration: none;
  transition: background-color .3s var(--ease), color .3s var(--ease), transform .4s var(--ease);
}

.ab-btn--pink {
  border-radius: 10px;
  border: 1px solid #62543D;
  color: var(--ink-soft);
  background: none;
}
.ab-btn--pink:hover{
  color : #fff;
}
.ab-btn--pink:hover,
.ab-btn--pink:focus-visible {
  background: var(--maroon);
  transform: translateY(-2px);
}

.ab-btn--white {
  background: #fff;
  color: var(--pink);
  font-weight: 500;
  min-height: 52px;
  padding: 0 28px;
}

.ab-btn--white:hover,
.ab-btn--white:focus-visible {
  background: var(--maroon);
  color: #fff;
}

.ab-btn--white {
  border-radius: 10px;
}

/* ---------- Banner ---------- */
.ab-hero {
  padding: clamp(36px, 4.5vw, 90px) var(--gutter) clamp(60px, 6vw, 120px);
}

.ab-hero__title {
  font-family: 'Season Mix-TRIAL';
  /* font-family: var(--font-display); */
  font-weight: 300;
  font-size: clamp(3.4rem, 11.6vw, 15.5rem);
  line-height: .98;
  letter-spacing: -.025em;
  margin: 0;
}

.ab-hero__title span,
.ab-hero__title em {
  display: block;
}

.ab-hero__title em {
  font-style: italic;
}

/* Art bleeds to the left edge; text column starts at ~50.7% of the viewport like the reference. */
.ab-hero__body {
  display: grid;
  grid-template-columns: minmax(0, calc(50.7vw - var(--gutter))) minmax(0, min(36.5vw, 760px));
  grid-template-areas: "art a" "art b";
  align-items: start;
  margin: clamp(30px, 3.2vw, 70px) 0 0 calc(var(--gutter) * -1);
  padding-left: var(--gutter);
}

.ab-hero__text {
  font-family: var(--font-ui);
  font-size: clamp(.85rem, .78vw, 1.05rem);
  line-height: 1.6;
  color: var(--ink-soft);
}

.ab-hero__text p {
  margin: 0;
}

.ab-hero__text p+p {
  margin-top: 1.4em;
}

.ab-hero__text--a {
  grid-area: a;
}

.ab-hero__text--b {
  grid-area: b;
  margin-top: 1.4em;
}

.ab-hero__text .ab-btn {
  margin-top: clamp(28px, 2.4vw, 44px);
}

.ab-hero__art {
  grid-area: art;
  align-self: end;
  margin-left: calc(var(--gutter) * -1);
  width: min(30vw, 620px);
}

.ab-hero__art img {
  width: 100%;
  mix-blend-mode: multiply;
}

/* drops the PNG's white ground on cream */
[data-theme="dark"] .ab-hero__art img {
  mix-blend-mode: normal;
  border-radius: 6px;
}

/* ---------- Organising Committee ---------- */
.ab-committee {
  padding: clamp(30px, 6vw, 50px) 0 clamp(40px, 8vw, 40px);
}

.ab-committee__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(3rem, 8.3vw, 10.5rem);
  line-height: .92;
  letter-spacing: -.02em;
  text-align: center;
  margin: 0 0 clamp(36px, 3.6vw, 70px);
  padding-inline: var(--gutter);
}

.ab-committee__track {
  display: flex;
  align-items: flex-start;
  gap: clamp(16px, 1.6vw, 32px);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-inline: var(--gutter);
  scroll-padding-inline: var(--gutter);
  outline: none;
}

.ab-committee__track::-webkit-scrollbar {
  display: none;
}

.ab-committee__track:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 4px;
}

.ab-committee__card {
  flex: 0 0 clamp(220px, 20vw, 360px);
  scroll-snap-align: start;
  min-width: 0;
}

.ab-committee__name {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(1.05rem, 1.45vw, 1.75rem);
  line-height: 1.25;
  margin: 0 0 clamp(12px, 1.2vw, 22px);
}

.ab-committee__img {
  width: 100%;
  height: auto;
}

.ab-committee__img--empty {
  aspect-ratio: 4 / 5;
  background: var(--tint);
}

.ab-committee__role {
  font-family: var(--font-ui);
  font-size: clamp(.85rem, .82vw, .99rem);
  color: var(--ink-soft);
  margin: clamp(12px, 1.2vw, 22px) 0 0;
}

.ab-committee__nav {
  display: flex;
  gap: 12px;
  padding: clamp(15px, 1.4vw, 30px) var(--gutter) 0;
}

.ab-committee__arrow {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid var(--ink-soft);
  color: var(--ink);
  background: transparent;
  cursor: pointer;
  transition: background-color .3s, color .3s, border-color .3s;
}

.ab-committee__arrow:hover,
.ab-committee__arrow:focus-visible {
  background: var(--pink);
  border-color: var(--pink);
  color: #fff;
}

/* ---------- Partners (pink banner) ---------- */
.ab-partner {
  --ab-p-fs: clamp(2.6rem, 7.8vw, 10rem);
  position: relative;
  padding: clamp(60px, 7.5vw, 160px) var(--gutter) clamp(70px, 7.5vw, 160px);
  color: #fff;
  background:
    radial-gradient(38% 50% at 18% 78%, rgba(255, 36, 64, .75), transparent 72%),
    radial-gradient(34% 45% at 68% 55%, rgba(255, 46, 80, .55), transparent 72%),
    radial-gradient(30% 40% at 42% 18%, rgba(255, 60, 96, .45), transparent 72%),
    #ee1f74;
}

.ab-partner__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: var(--ab-p-fs);
  line-height: 1;
  letter-spacing: -.02em;
  color: #fff;
  margin: 0;
}

.ab-partner__title span {
  display: block;
}

/* Body sits beside the last heading line ("together."), starting at ~50.7% of the viewport. */
.ab-partner__body {
  position: relative;
  margin: calc(var(--ab-p-fs) * -0.52) 0 0 calc(50.7vw - var(--gutter));
  max-width: min(33vw, 640px);
}

.ab-partner__body p {
  font-family: var(--font-ui);
  font-size: clamp(.85rem, .8vw, 1.05rem);
  line-height: 1.75;
  margin: 0 0 clamp(24px, 2.2vw, 40px);
}

/* ---------- Glimpse 2023: images scattered around the title ---------- */
.ab-glimpse {
  padding: clamp(60px, 6vw, 120px) var(--gutter) clamp(80px, 8vw, 160px);
}

.ab-glimpse__stage {
  position: relative;
  max-width: 1760px;
  margin: 0 auto;
  aspect-ratio: 1100 / 700;
}

.ab-glimpse__title {
  position: absolute;
  left: 50%;
  top: 47%;
  transform: translate(-50%, -50%);
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.2rem, 4.6vw, 6.4rem);
  line-height: 1.05;
  letter-spacing: -.02em;
  text-align: center;
  white-space: nowrap;
  z-index: 1;
}

.ab-glimpse__item {
  position: absolute;
  margin: 0;
}

.ab-glimpse__item img {
  width: 100%;
  border-radius: 10px;
}

/* Slot positions and widths taken from the desktop reference (stage = 1100 x 700). */
.ab-glimpse__item--hall {
  left: 28%;
  top: 3.7%;
  width: 13.5%;
}

.ab-glimpse__item--crowd {
  left: 50.7%;
  top: 6.9%;
  width: 21.3%;
}

.ab-glimpse__item--birds {
  left: 79.5%;
  top: 3.7%;
  width: 15.3%;
}

.ab-glimpse__item--forest {
  left: 5.5%;
  top: 27%;
  width: 14.8%;
}

.ab-glimpse__item--flame {
  left: 81.4%;
  top: 42.3%;
  width: 13.5%;
}

.ab-glimpse__item--wood {
  left: 24.2%;
  top: 65.3%;
  width: 14%;
}

.ab-glimpse__item--cubes {
  left: 43.2%;
  top: 77.9%;
  width: 13.6%;
}

.ab-glimpse__item--fan {
  left: 62%;
  top: 67.1%;
  width: 13.5%;
}

/* =========================== Tablet =========================== */
@media (max-width: 1023px) {
  .ab-hero__body {
    grid-template-columns: minmax(0, 42%) minmax(0, 1fr);
    column-gap: 32px;
  }

  .ab-hero__art {
    width: calc(100% + var(--gutter));
  }

  .ab-hero__text {
    font-size: .95rem;
  }

  .ab-committee__card {
    flex-basis: 42%;
  }

  .ab-partner__body {
    margin-left: 42%;
    max-width: none;
  }

  .ab-partner__body p {
    font-size: .95rem;
  }

  .ab-glimpse__stage {
    aspect-ratio: 1100 / 760;
  }
}

/* =========================== Mobile =========================== */
@media (max-width: 639px) {
  .ab-hero {
    padding-block: 28px 56px;
  }

  .ab-hero__title {
    font-size: clamp(2.8rem, 16.4vw, 4.4rem);
    line-height: 1;
  }

  /* Order: first two paragraphs, artwork (full width), remaining text + full-width button */
  .ab-hero__body {
    display: flex;
    flex-direction: column;
    margin: 40px 0 0;
    padding-left: 0;
  }

  .ab-hero__text {
    font-size: .95rem;
    line-height: 1.7;
    padding-inline: 24px 4px;
  }

  .ab-hero__text p+p {
    margin-top: 1.6em;
  }

  .ab-hero__text--b {
    margin-top: 0;
  }

  .ab-hero__art {
    order: 0;
    align-self: center;
    width: calc(100% + 2 * var(--gutter));
    max-width: 480px;
    margin: 36px calc(var(--gutter) * -1);
  }

  .ab-hero__text--a {
    order: -1;
  }

  .ab-hero__text--b {
    order: 1;
  }

  .ab-hero__text .ab-btn {
    display: flex;
    width: calc(100% + 28px);
    margin: 40px 0 0 -24px;
    min-height: 58px;
    font-size: 1rem;
  }

  .ab-committee {
    padding-block: 64px 72px;
  }

  .ab-committee__title {
    font-size: clamp(2.6rem, 12.5vw, 3.6rem);
    text-align: left;
    padding-left: 14%;
  }

  .ab-committee__track {
    padding-inline: 0 var(--gutter);
    scroll-padding-inline: 0;
  }

  .ab-committee__card {
    flex-basis: 67%;
  }

  .ab-committee__name {
    font-family: var(--font-display);
    font-weight: 500;
    font-size: clamp(1.1rem, 5.4vw, 1.4rem);
  }

  .ab-committee__role {
    font-size: .8rem;
  }

  .ab-committee__nav {
    padding-left: 0;
  }

  .ab-partner {
    --ab-p-fs: clamp(2.4rem, 12.4vw, 3.4rem);
    padding: 64px var(--gutter) 64px;
  }

  .ab-partner__title {
    line-height: 1.04;
  }

  .ab-partner__title span {
    display: inline;
  }

  .ab-partner__body {
    margin: 28px 0 0;
    max-width: none;
  }

  .ab-partner__body p {
    font-size: .95rem;
    line-height: 1.7;
    margin-bottom: 32px;
  }

  /* Glimpse: 2-column staggered grid with the title in the middle */
  .ab-glimpse {
    padding-block: 64px 72px;
  }

  .ab-glimpse__stage {
    aspect-ratio: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 24px;
    align-items: start;
  }

  .ab-glimpse__title {
    position: static;
    transform: none;
    grid-column: 1 / -1;
    order: 5;
    white-space: normal;
    font-size: clamp(2rem, 9.6vw, 2.8rem);
    margin: 8px 0;
  }

  .ab-glimpse__item {
    position: static;
  }

  .ab-glimpse__item--hall {
    order: 1;
    width: 90%;
    margin-top: 24px;
  }

  .ab-glimpse__item--crowd {
    order: 2;
    width: 100%;
    justify-self: end;
  }

  .ab-glimpse__item--forest {
    order: 3;
    width: 78%;
  }

  .ab-glimpse__item--birds {
    order: 4;
    width: 84%;
    justify-self: end;
    margin-top: 40px;
  }

  .ab-glimpse__item--wood {
    order: 6;
    width: 84%;
  }

  .ab-glimpse__item--fan {
    order: 7;
    width: 100%;
    justify-self: end;
    margin-top: 24px;
  }

  .ab-glimpse__item--cubes {
    order: 8;
    width: 96%;
  }

  .ab-glimpse__item--flame {
    order: 9;
    width: 78%;
    justify-self: end;
    margin-top: 16px;
  }
}

/* =====================================================================
   Committee cards: equal 4:5 image boxes (10px radius), photo never cropped
   (contain) with a blurred copy filling spare space, calm hover like the
   home page team: lift + soft shadow + fine cream frame + name turns pink.
   ===================================================================== */
.ab-committee__img-wrap {
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: 10px;
  overflow: hidden;
  isolation: isolate;
  background: var(--tint);
  transition: transform 0.6s cubic-bezier(.16, 1, .3, 1), box-shadow 0.6s cubic-bezier(.16, 1, .3, 1);
}

.ab-committee__img-wrap::before {
  content: '';
  position: absolute;
  inset: -12%;
  background: var(--img-bg) center / cover no-repeat;
  filter: blur(18px);
  opacity: 0.9;
  z-index: -1;
  transition: transform 1.2s cubic-bezier(.16, 1, .3, 1);
}

.ab-committee__img-wrap::after {
  content: '';
  position: absolute;
  inset: 12px;
  border: 1px solid rgba(255, 247, 233, 0.85);
  border-radius: 6px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.6s ease, inset 0.6s cubic-bezier(.16, 1, .3, 1);
}

.ab .ab-committee__img-wrap .ab-committee__img {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.ab-committee__name {
  transition: color 0.4s ease;
}

@media (hover: hover) {
  .ab-committee__card:hover .ab-committee__img-wrap {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px -22px rgba(26, 10, 16, 0.45);
  }

  .ab-committee__card:hover .ab-committee__img-wrap::before {
    transform: scale(1.06);
  }

  .ab-committee__card:hover .ab-committee__img-wrap::after {
    opacity: 1;
    inset: 16px;
  }

  .ab-committee__card:hover .ab-committee__name {
    color: var(--accent);
  }
}

/* the lifted card must not be clipped by the scroll row */
.ab-committee__track {
  padding-top: 10px;
  padding-bottom: 24px;
}

@media (prefers-reduced-motion: reduce) {

  .ab-committee__img-wrap,
  .ab-committee__img-wrap::before {
    transition: none;
    transform: none !important;
  }
}

/* "Organising Committee" on one line (the <br> in the markup is ignored) */
.ab-committee__title br {
  display: none;
}

.ab-committee__title {
  font-size: clamp(2rem, 6.4vw, 8rem);
}

@media (max-width: 639px) {
  .ab-committee__title {
    font-size: clamp(1.7rem, 8.4vw, 2.6rem);
    padding-left: var(--gutter);
    white-space: nowrap;
  }
}

/* Committee photos a little shorter: 4:5 -> 1:1 (still equal for all, never cropped) */
.ab-committee__img-wrap {
  aspect-ratio: 1 / 1;
}

/* Committee hover: one clean frame only (turn off the site-wide image outline here)
   and a lighter darken so the photo stays bright. */
.iaadb-layout__main .ab-committee__img,
.iaadb-layout__main .ab-committee__card:hover .ab-committee__img {
  outline: none !important;
}

@media (hover: hover) {
  .iaadb-layout__main .ab-committee__card:hover .ab-committee__img {
    filter: brightness(0.88) !important;
  }

  .ab-committee__card:hover .ab-committee__img-wrap::after {
    z-index: 2;
  }
}


/* --- calendar-of-events.css --- */
/* =====================================================================
   Calendar of Events page. Desktop first, then tablet (max 1023px) and mobile (max 639px).
   Images keep their natural aspect ratio (width set, height:auto): never cropped.
   ===================================================================== */
.coe {
  --coe-blue: #1446d6;
  --coe-pill: #fbe8c8;
  --coe-active: #fde6e4;
  background: var(--bg);
  color: var(--ink);
  overflow-x: clip;
}

[data-theme="dark"] .coe {
  --coe-pill: #2a2119;
  --coe-active: #2a1a16;
}

.coe img {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ---------- Title ---------- */
.coe-hero {
  position: relative;
  padding: clamp(32px, 4.5vw, 90px) var(--gutter) clamp(50px, 6.5vw, 130px);
}

.coe-hero__title {
  position: relative;
  z-index: 1;
  margin: 0;
  font-family: 'Season Mix-TRIAL';
  ;
  /* font-family: var(--font-display); */
  font-weight: 300;
  font-size: clamp(3.2rem, 10.6vw, 14rem);
  line-height: .96;
  letter-spacing: -.025em;
}

.coe-hero__title em {
  font-style: italic;
}

/* Faded tree artwork, top-right (whole image, never cropped) */
.coe-hero__art {
  position: absolute;
  right: 0;
  top: clamp(20px, 4vw, 80px);
  width: min(26vw, 480px);
  opacity: .14;
  filter: sepia(.4) saturate(.6);
  mix-blend-mode: multiply;
  pointer-events: none;
}

[data-theme="dark"] .coe-hero__art {
  mix-blend-mode: normal;
  opacity: .08;
}

/* ---------- Toolbar ---------- */
.coe-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px clamp(20px, 2.6vw, 48px);
  padding: 0 var(--gutter) clamp(20px, 1.8vw, 32px);
}

.coe-bar__month {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.4vw, 26px);
}

.coe-bar__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.2rem, 4.4vw, 5.8rem);
  line-height: 1;
  letter-spacing: -.02em;
  white-space: nowrap;
}

.coe-bar__arrows {
  display: flex;
  gap: 8px;
}

.coe-arrow {
  display: grid;
  place-items: center;
  width: clamp(26px, 1.6vw, 34px);
  height: clamp(26px, 1.6vw, 34px);
  border-radius: 50%;
  background: var(--coe-blue);
  color: #fff;
  border: 0;
  cursor: pointer;
  transition: transform .3s var(--ease), background-color .3s;
}

.coe-arrow:hover,
.coe-arrow:focus-visible {
  background: var(--pink);
  transform: scale(1.08);
}

.coe-bar__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}

.coe-filter {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.coe-filter select {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  border-radius: 2px;
  background: var(--coe-pill);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: clamp(.9rem, .9vw, 1.1rem);
  line-height: 1;
  padding: 10px 36px 10px 16px;
  cursor: pointer;
  field-sizing: content;
  /* width follows the selected label, not the longest option */
  max-width: 100%;
}

.coe-filter svg {
  position: absolute;
  right: 14px;
  pointer-events: none;
}

.coe-filter select:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
}

.coe-view-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: clamp(0px, 3vw, 64px);
  padding: 8px 16px;
  border: 0;
  border-radius: 2px;
  background: var(--coe-blue);
  color: #fff;
  font-family: var(--font-ui);
  font-size: clamp(.9rem, .95vw, 1.15rem);
  cursor: pointer;
  transition: background-color .3s;
}

.coe-view-btn:hover,
.coe-view-btn:focus-visible {
  background: var(--pink);
}

/* Shared small underlined uppercase link (GET PASS / +N MORE) */
.coe-link {
  display: inline-block;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: clamp(.62rem, .6vw, .78rem);
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

.coe-link:hover,
.coe-link:focus-visible {
  color: var(--accent);
}

/* ---------- Calendar grid ---------- */
.coe-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 0 var(--gutter);
  position: relative;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
}

/* Top rule runs the full page width, past the grid's side borders */
.coe-grid::before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(var(--gutter) * -1 - 1px);
  right: calc(var(--gutter) * -1 - 1px);
  height: 1px;
  background: var(--line);
}

.coe-grid.is-hidden {
  display: none;
}

.coe-day {
  min-width: 0;
  padding: clamp(6px, .6vw, 12px) clamp(6px, .5vw, 10px) clamp(14px, 1.2vw, 22px);
  border-bottom: 1px solid var(--line);
}

.coe-day__num {
  margin: 0 0 clamp(6px, .6vw, 12px);
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 1.5vw, 2rem);
  line-height: 1;
}

.coe-day__img {
  width: 100%;
}

.coe-day__caption {
  margin: 8px 0 4px;
  font-family: var(--font-ui);
  font-size: clamp(.62rem, .62vw, .8rem);
  line-height: 1.3;
  color: var(--ink-soft);
}

.coe-day__titles {
  list-style: none;
  margin: 0 0 clamp(14px, 1.4vw, 24px);
  padding: 0;
}

.coe-day__titles li {
  font-family: var(--font-ui);
  font-size: clamp(.75rem, .8vw, 1rem);
  line-height: 1.3;
  max-width: 11em;
}

.coe-day__titles li+li {
  margin-top: clamp(14px, 1.3vw, 24px);
}

/* ---------- List view ---------- */
.coe-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.coe-list.is-desktop-hidden {
  display: none;
}

.coe-row {
  display: grid;
  grid-template-columns: minmax(0, 2.05fr) minmax(0, 2.9fr) minmax(0, 2.25fr) minmax(0, 2.1fr);
  column-gap: clamp(16px, 2vw, 40px);
  align-items: start;
  padding: clamp(14px, 1.1vw, 22px) var(--gutter);
  border-top: 1px solid var(--line);
}

.coe-row:first-child {
  border-top: 0;
}

.coe-row--active {
  background: var(--coe-active);
}

.coe-row__when {
  padding-top: clamp(8px, 1vw, 20px);
}

.coe-row__date {
  margin: 0 0 clamp(10px, 1vw, 18px);
  font-family: var(--font-ui);
  font-size: clamp(1.2rem, 1.3vw, 1.7rem);
  font-weight: 500;
  letter-spacing: .02em;
}

.coe-row--active .coe-row__date {
  color: var(--pink);
}

.coe-row__meta {
  display: flex;
  flex-direction: column;
  margin: 0;
  font-family: var(--font-ui);
  font-size: clamp(.72rem, .72vw, .92rem);
  font-weight: 600;
  line-height: 1.35;
  text-transform: uppercase;
}

.coe-row__sep {
  display: none;
}

.coe-row__main {
  padding-top: clamp(10px, 1.1vw, 22px);
}

.coe-row__title {
  margin: 0 0 clamp(12px, 1.1vw, 20px);
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.15rem, 1.45vw, 1.9rem);
  line-height: 1.2;
}

.coe-pass {
  display: inline-block;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: clamp(.68rem, .66vw, .85rem);
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.coe-pass--boxed {
  padding: 8px 16px;
  border: 1px solid var(--pink);
  text-decoration: none;
}

.coe-pass:hover,
.coe-pass:focus-visible {
  color: var(--accent);
}

.coe-pass--boxed:hover,
.coe-pass--boxed:focus-visible {
  background: var(--pink);
  color: #fff;
}

.coe-row__about {
  padding-top: clamp(4px, .6vw, 14px);
}

.coe-tag {
  display: inline-block;
  padding: 3px 12px;
  border-radius: 999px;
  color: #fff;
  font-family: var(--font-ui);
  font-size: clamp(.7rem, .68vw, .88rem);
  line-height: 1.4;
}

.coe-tag--music {
  background: #f26a1b;
}

.coe-tag--theatre {
  background: #c45ae6;
}

.coe-tag--performances {
  background: #f0c400;
}

.coe-tag--workshops {
  background: #1a9c88;
}

.coe-tag--walks {
  background: #a8c41b;
}

.coe-tag--talks {
  background: #f0287d;
}

.coe-tag--community {
  background: #1446d6;
}

.coe-row__desc {
  margin: 8px 0 0;
  font-family: var(--font-ui);
  font-size: clamp(.72rem, .72vw, .92rem);
  line-height: 1.5;
  color: var(--ink-soft);
}

/* Image keeps its ratio; height is capped so rows stay compact (no cropping) */
.coe .coe-row__img {
  width: auto;
  max-width: 100%;
  max-height: clamp(110px, 8.2vw, 170px);
  justify-self: end;
}

.coe-empty {
  padding: 48px var(--gutter);
  font-family: var(--font-ui);
  color: var(--ink-soft);
}

/* ---------- Plan your visit ---------- */
.coe-plan {
  padding: clamp(60px, 7vw, 140px) 0 clamp(70px, 9vw, 170px);
}

.coe-plan__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2rem, 8.5vw, 18rem);
  /* font-size: clamp(4rem, 19.5vw, 26rem); */
  line-height: .9;
  letter-spacing: -.035em;
  padding-left: clamp(8px, .6vw, 14px);
}

.coe-plan__title span,
.coe-plan__title em {
  display: block;
  white-space: nowrap;
}

.coe-plan__title em {
  font-style: italic;
  padding-left: clamp(10px, 1vw, 24px);
}

/* Button sits to the right of "Visit" */
.coe-plan__btn {
  display: flex;
  border-radius: 10px;
  align-items: center;
  justify-content: center;
  width: min(39vw, 750px);
  min-height: clamp(54px, 5.4vw, 104px);
  margin: calc(clamp(54px, 5.4vw, 104px) * -1 - clamp(20px, 5vw, 96px)) 0 0 auto;
  margin-right: var(--gutter);
  border: 1px solid var(--line);
  color: var(--ink);
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2.6vw, 3.4rem);
  font-weight: 300;
  text-decoration: none;
  position: relative;
  transition: background-color .3s, color .3s, border-color .3s;
}

.coe-plan__btn:hover,
.coe-plan__btn:focus-visible {
  background: var(--pink);
  border-color: var(--pink);
  color: #fff;
}

/* =========================== Tablet =========================== */
@media (max-width: 1023px) {
  .coe-bar__filters {
    margin-left: 0;
  }

  .coe-view-btn {
    margin-left: auto;
  }

  .coe-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .coe-day__titles li {
    font-size: .9rem;
  }

  .coe-day__caption,
  .coe-link {
    font-size: .72rem;
  }

  .coe-row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    grid-template-areas: "when main" "about about" "img img";
    row-gap: 14px;
  }

  .coe-row__when {
    grid-area: when;
  }

  .coe-row__main {
    grid-area: main;
  }

  .coe-row__about {
    grid-area: about;
  }

  .coe .coe-row__img {
    grid-area: img;
    justify-self: start;
    max-height: 220px;
  }

  .coe-row__desc {
    font-size: .9rem;
  }
}

/* =========================== Mobile =========================== */
@media (max-width: 639px) {
  .coe-hero {
    padding-block: 28px 32px;
  }

  .coe-hero__title {
    font-size: clamp(2.6rem, 15vw, 3.8rem);
  }

  .coe-hero__art {
    width: 46vw;
    top: 40px;
  }

  .coe-bar {
    gap: 18px;
    padding-bottom: 24px;
  }

  .coe-bar__month {
    width: 100%;
    justify-content: space-between;
  }

  .coe-bar__title {
    font-size: clamp(1.9rem, 10vw, 2.6rem);
  }

  .coe-arrow {
    width: 28px;
    height: 28px;
  }

  .coe-bar__filters {
    gap: 8px;
  }

  .coe-filter select {
    font-size: 1rem;
    padding: 8px 34px 8px 14px;
  }

  /* Mobile always shows the list (reference): no toggle, no grid, no images */
  .coe-view-btn,
  .coe-grid {
    display: none;
  }

  .coe-list.is-desktop-hidden {
    display: block;
  }

  .coe-row {
    display: flex;
    flex-direction: column;
    padding: 24px var(--gutter) 26px;
    background: none;
  }

  .coe-row--active {
    background: none;
  }

  .coe-row__when,
  .coe-row__main,
  .coe-row__about {
    padding-top: 0;
  }

  .coe-row__about {
    display: contents;
  }

  .coe-tag {
    order: -1;
    align-self: flex-start;
    margin-bottom: 12px;
    font-size: .85rem;
    padding: 4px 16px;
  }

  .coe-row__date {
    margin-bottom: 4px;
    font-size: 1.15rem;
    color: var(--ink);
  }

  .coe-row--active .coe-row__date {
    color: var(--ink);
  }

  .coe-row__meta {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0 8px;
    font-size: .95rem;
    font-weight: 600;
  }

  .coe-row__sep {
    display: inline;
  }

  .coe-row__main {
    display: contents;
  }

  .coe-row__title {
    order: 2;
    margin: 16px 0 12px;
    font-size: clamp(1.35rem, 6.2vw, 1.6rem);
  }

  .coe-row__desc {
    order: 3;
    margin: 0;
    font-size: .95rem;
    line-height: 1.6;
  }

  .coe-pass {
    order: 4;
    align-self: flex-start;
    margin-top: 18px;
    font-size: .9rem;
  }

  .coe-pass--boxed {
    display: none;
  }

  /* first item shows no pass link in the mobile reference */
  .coe .coe-row__img {
    display: none;
  }

  .coe-plan {
    padding-block: 64px 72px;
  }

  .coe-plan__title {
    font-size: clamp(3.2rem, 17vw, 4.6rem);
    padding-left: var(--gutter);
  }

  .coe-plan__title em {
    padding-left: 4px;
  }

  .coe-plan__btn {
    width: auto;
    min-height: 60px;
    margin: 32px var(--gutter) 0;
    font-size: 1.4rem;
  }
}

/* =====================================================================
   List images: every row gets the same box (3:2, 10px corners). The full
   image sits inside uncropped; a blurred copy fills any spare space.
   ===================================================================== */
.coe-row__media {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 2;
  border-radius: 10px;
  overflow: hidden;
  isolation: isolate;
}

.coe-row__media::before {
  content: '';
  position: absolute;
  inset: -12%;
  background: var(--img-bg) center / cover no-repeat;
  filter: blur(18px);
  opacity: 0.9;
  z-index: -1;
}

.coe .coe-row__media .coe-row__img {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  object-fit: contain;
  justify-self: auto;
}

@media (max-width: 1023px) {
  .coe-row__media {
    grid-area: img;
    max-width: 360px;
  }
}

@media (max-width: 639px) {
  .coe-row__media {
    display: none;
  }
}

@media (min-width: 1024px) {

  /* keep rows compact: equal box, about the previous row height */
  .coe-row__media {
    width: min(100%, clamp(200px, 14vw, 270px));
    justify-self: end;
  }
}


/* --- contact.css --- */
.iaadb-contact {
  color: var(--iaadb-ivory);
}

.iaadb-contact__hero {
  position: relative;
  overflow: hidden;
  padding: 30px 0 65px;
  border-bottom: 1px solid var(--iaadb-border);
  background: linear-gradient(110deg, #30291b, var(--iaadb-ink) 75%);
}

.iaadb-contact__hero .iaadb-container {
  position: relative;
  z-index: 1;
}

.iaadb-contact__breadcrumb {
  display: flex;
  gap: 14px;
  font-size: 12px;
  color: var(--iaadb-muted);
  margin-bottom: 50px;
}

.iaadb-contact__breadcrumb a {
  text-decoration: none;
}

.iaadb-contact__hero h1 {
  font-size: clamp(36px, 4.7vw, 64px);
  line-height: 1.15;
  letter-spacing: -1px;
  margin: 20px 0;
}

.iaadb-contact__hero h1 em {
  color: var(--iaadb-gold);
  font-weight: 400;
}

.iaadb-contact__hero p {
  color: var(--iaadb-muted);
  line-height: 1.9;
  font-size: 14px;
  max-width: 650px;
}

.iaadb-contact__arch {
  position: absolute;
  width: 290px;
  height: 440px;
  right: 10%;
  bottom: -160px;
  border: 1px solid #b69b6240;
  border-radius: 180px 180px 0 0;
  box-shadow: 0 0 0 25px #15130f, 0 0 0 26px #b69b6220, 0 0 0 52px #15130f, 0 0 0 53px #b69b6218;
  transform: rotate(12deg);
}

.iaadb-contact__grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 80px;
  padding-top: 70px;
  padding-bottom: 65px;
}

.iaadb-contact__info h2 {
  font-size: 34px;
  line-height: 1.2;
  margin: 18px 0;
}

.iaadb-contact__info>p,
.iaadb-contact__visit p {
  font-size: 13px;
  line-height: 1.9;
  color: var(--iaadb-muted);
}

.iaadb-contact__venue {
  display: flex;
  gap: 20px;
  border-top: 1px solid var(--iaadb-border);
  padding-top: 28px;
  margin-top: 30px;
}

.iaadb-contact__symbol {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  background: var(--iaadb-surface);
  border: 1px solid var(--iaadb-border);
  border-radius: 50%;
  color: var(--iaadb-gold);
}

.iaadb-contact__venue h3 {
  font-size: 18px;
  margin: 0 0 12px;
}

.iaadb-contact__venue address {
  font-style: normal;
  color: var(--iaadb-muted);
  font-size: 13px;
  line-height: 1.9;
  margin-bottom: 14px;
}

.iaadb-contact__venue a {
  font-size: 12px;
  text-underline-offset: 5px;
}

.iaadb-contact__visit {
  padding: 25px;
  background: var(--iaadb-surface);
  border: 1px solid var(--iaadb-border);
  margin-top: 35px;
  border-radius: 10px;
}

.iaadb-contact__visit h3 {
  font-size: 23px;
  margin: 16px 0 10px;
}

.iaadb-contact__visit a {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  text-decoration: none;
  padding: 12px 0;
  border-top: 1px solid var(--iaadb-border);
}

.iaadb-contact__form-panel {
  padding: 35px;
  background: #211d17;
  border: 1px solid var(--iaadb-border);
  border-radius: 12px;
}

.iaadb-contact__form-panel h2 {
  font-size: 30px;
  margin: 16px 0 10px;
}

.iaadb-contact__form-panel>p {
  color: var(--iaadb-muted);
  font-size: 12px;
  line-height: 1.8;
  margin-bottom: 30px;
}

.iaadb-contact fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
}

.iaadb-contact__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.iaadb-contact label {
  display: block;
  font-size: 12px;
  color: var(--iaadb-ivory);
  margin-bottom: 22px;
}

.iaadb-contact input,
.iaadb-contact textarea,
.iaadb-contact select {
  display: block;
  width: 100%;
  background: #191711;
  color: var(--iaadb-ivory);
  border: 1px solid #64543b;
  border-radius: 6px;
  font: inherit;
  font-size: 13px;
  margin-top: 10px;
  padding: 13px 14px;
  color-scheme: dark;
}

.iaadb-contact textarea {
  resize: vertical;
  min-height: 150px;
}

.iaadb-contact input::placeholder,
.iaadb-contact textarea::placeholder {
  color: #9e927e;
}

.iaadb-contact :is(input, select, textarea, button, a):focus-visible {
  outline: 2px solid var(--iaadb-gold);
  outline-offset: 3px;
}

.iaadb-contact__submit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.iaadb-contact__submit p {
  max-width: 190px;
  font-size: 11px;
  line-height: 1.7;
  color: var(--iaadb-muted);
}

.iaadb-contact__submit button {
  white-space: nowrap;
  cursor: pointer;
}

.iaadb-contact fieldset:disabled {
  opacity: .65;
}

.iaadb-contact__error {
  color: #ffbba4;
  font-size: 13px;
  line-height: 1.7;
}

.iaadb-contact__success {
  padding: 30px 0;
}

.iaadb-contact__success>span {
  font-size: 36px;
  color: var(--iaadb-gold);
}

.iaadb-contact__success p {
  color: var(--iaadb-muted);
  line-height: 1.8;
}

.iaadb-contact__closing {
  border-top: 1px solid var(--iaadb-border);
  padding-top: 25px;
  padding-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.iaadb-contact__closing span {
  font-size: 9px;
  letter-spacing: 1.5px;
  color: var(--iaadb-muted);
}

.iaadb-contact__closing p {
  font: italic 20px Georgia, serif;
  color: var(--iaadb-gold);
}

.iaadb-contact__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}

@media(max-width:900px) {
  .iaadb-contact__grid {
    gap: 30px;
  }

  .iaadb-contact__fields {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .iaadb-contact__arch {
    opacity: .4;
    right: -100px;
  }
}

@media(max-width:680px) {
  .iaadb-contact__grid {
    grid-template-columns: 1fr;
    padding-top: 40px;
  }

  .iaadb-contact__form-panel {
    padding: 24px;
  }

  .iaadb-contact__closing {
    flex-direction: column;
    align-items: flex-start;
  }

  .iaadb-contact__submit {
    flex-wrap: wrap;
  }
}


/* --- ContactClient.css --- */
.contact-section-container {
  padding-top: 60px !important;
}

.contact-map-wrapper {
  margin-top: 2rem;
  width: 100%;
  min-height: 350px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.contact-follow-title {
  margin-top: 2rem;
}

.contact-social-links {
  display: flex;
  gap: 1.5rem;
  margin-top: 0.5rem;
}

.contact-social-link {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--color-rust);
}

.contact-form-select {
  border: none;
  border-bottom: 1px solid var(--color-gray-800);
  padding: 0.75rem 0;
  width: 100%;
  background: transparent;
  color: inherit;
  outline: none;
  font-size: 1rem;
}

/* FAQ Accordion Styling */
.faqs-section {
  background-color: #0a0a0a;
  color: var(--color-white);
  padding: 8rem 0;
  position: relative;
}

.faq-section-header {
  text-align: center;
  margin-bottom: 2rem;
}

.faq-label {
  color: var(--color-rust);
  letter-spacing: 0.2em;
}

.faq-title {
  color: var(--color-white);
  margin-top: 1rem;
}

.faq-accordion {
  max-width: 900px;
  margin: 4rem auto 0;
}

.faq-accordion-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.faq-accordion-header {
  width: 100%;
  background: transparent;
  border: none;
  padding: 2.5rem 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--color-white);
  cursor: pointer;
  transition: all 0.3s ease;
  text-align: left;
}

.faq-accordion-header h3 {
  font-size: 1.75rem;
  margin: 0;
  font-weight: 300;
  letter-spacing: -0.02em;
  transition: color 0.3s ease;
}

.faq-accordion-header:hover h3,
.faq-accordion-header.active h3 {
  color: var(--color-rust);
}

.faq-icon {
  font-size: 2rem;
  font-weight: 300;
  line-height: 1;
  color: var(--color-rust);
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.faq-icon.open {
  transform: rotate(135deg);
}

.faq-accordion-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.faq-accordion-content.open {
  grid-template-rows: 1fr;
}

.faq-accordion-inner {
  overflow: hidden;
  padding-right: 2rem;
}

.faq-accordion-inner>div {
  padding-bottom: 2.5rem;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.8;
  font-size: 1.15rem;
}

.faq-accordion-inner>div a {
  color: var(--color-rust);
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (max-width: 768px) {
  .faq-accordion-header h3 {
    font-size: 1.25rem;
  }

  .faq-accordion-header {
    padding: 1.5rem 0;
  }

  .faq-accordion-inner>div {
    font-size: 1rem;
    padding-bottom: 1.5rem;
  }
}


/* --- media.css --- */
.media-page-wrapper {
  min-height: 100vh;
}

.media-page-hero {
  /* Inherits from iaadb-hero */
  position: relative;
  background: none !important;
  border-bottom: none !important;
}

.media-page-demo-notice {
  background-color: rgba(200, 150, 50, 0.1);
  padding: 1rem;
  border-radius: 4px;
  border-left: 4px solid #c89632;
  margin-bottom: 2rem;
  color: #555;
}


/* --- VenueDetail.css --- */
/* ============================================
   VENUE DETAILS & EVENT CARDS
   ============================================ */

.event-card {
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
}

.event-card-img-wrap {
  width: 100%;
  height: 240px;
  position: relative;
}

.event-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.3s;
}

.event-card-category {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: var(--color-saffron, #ff6b35);
  color: #fff;
  padding: 0.3rem 0.8rem;
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.event-card-gallery {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding: 0.75rem 1rem;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, transparent 100%);
}

.event-card-thumb {
  width: 45px;
  height: 45px;
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
  cursor: pointer;
  transition: all 0.2s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.3);
  opacity: 0.6;
}

.event-card-thumb.active {
  border: 2px solid #ff6b35;
  opacity: 1;
}

.event-card-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.event-card-body {
  padding: 2rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.event-card-title {
  font-size: 1.25rem;
  margin-bottom: 1rem;
  line-height: 1.4;
}

.event-card-time {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  color: #6b7280;
  font-size: 0.875rem;
}

.event-card-desc {
  color: #4b5563;
  font-size: 0.875rem;
  margin-top: 1rem;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.venue-events-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 2rem;
}

.venue-events-section {
  padding-top: 4rem;
}

.venue-detail-desc {
  margin-bottom: 1rem;
  color: rgba(255, 255, 255, 0.8);
  font-size: 1.1rem;
  /* line-height: 1.8; */
  /* max-width: 1000px; */
}

.loading-events {
  padding: 4rem;
  text-align: center;
  opacity: 0.5;
}

.coming-soon-wrapper-events {
  padding: 6rem 2rem;
  text-align: center;
  width: 100%;
  border: 1px dashed rgba(255, 255, 255, 0.2);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

.coming-soon-icon {
  font-size: 2.5rem;
  color: #ff6b35;
  opacity: 0.8;
}

.coming-soon-title {
  font-size: 2.5rem;
  margin: 0;
  font-weight: normal;
}

.coming-soon-desc {
  color: rgba(255, 255, 255, 0.6);
  max-width: 400px;
  margin: 0 auto;
}

.event-card-buy-wrap {
  display: flex;
  justify-content: flex-end;
  margin-top: 1.5rem;
}

.btn-buy-small {
  background-color: var(--color-saffron, #ff6b35);
  color: #fff;
  border: none;
  padding: 0.5rem 1.25rem;
  border-radius: 4px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.btn-buy-small:hover {
  background-color: #e85a28;
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(255, 107, 53, 0.3);
}

.venue-desc-html {
  color: black
}

/* Dark theme: white cards / black copy mapped to the dark palette */
[data-theme="dark"] .event-card {
  background: #16120E;
  border: 1px solid var(--line);
}

[data-theme="dark"] .event-card-title,
[data-theme="dark"] .venue-desc-html {
  color: var(--ink);
}

[data-theme="dark"] .event-card-time,
[data-theme="dark"] .event-card-desc {
  color: var(--ink-soft);
}

/* --- responsive.css --- */
/* ==========================================================================
   THE INDIA BIENNALE ’26 — responsive.css
   Tablet and mobile art direction (not just shrunk desktop).
   Test widths: 320 360 375 390 414 480 768 834 1024 1280 1366 1440 1920
   ========================================================================== */

/* ---------- Large screens: fill display gracefully ---------- */
@media (min-width: 1200px) {
  .hero__word {
    font-size: clamp(5.4rem, min(15vw, 18.2vh), 17.5rem);
  }

  .hero__dates,
  .hero__city {
    font-size: clamp(1.3rem, min(1.95vw, 3.2vh), 2.45rem);
  }
}

@media (min-width: 1600px) {
  :root {
    --gutter: clamp(80px, 5vw, 140px);
  }

  .hero__word {
    font-size: clamp(9rem, min(15.5vw, 19vh), 18.5rem);
  }
}

/* ---------- Laptop ---------- */
@media (max-width: 1279px) {
  .site-header__inner {
    padding-left: var(--gutter);
  }

  .brand__title {
    font-size: 1.35rem;
  }

  .brand__rule {
    height: 68px;
  }

  .footer-nav {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 36px;
  }

  .site-footer__inner {
    grid-template-columns: 1fr;
    row-gap: 48px;
  }
}

/* ---------- Tablet ---------- */
@media (max-width: 1023px) {
  :root {
    --head-h: 96px;
  }

  .site-header .btn-pass {
    height: 52px;
    padding: 0 24px;
    font-size: .95rem;
  }

  .nav-link {
    display: none;
  }

  .brand {
    gap: 12px;
  }

  .brand__title {
    font-size: 1.2rem;
  }

  .brand__emblem {
    width: 36px;
    height: 44px;
  }

  .brand__ministry-text {
    font-size: .66rem;
  }

  .brand__ministry-text strong {
    font-size: .95rem;
  }

  .brand__rule {
    height: 58px;
  }

  .hero {
    height: calc(100vh - var(--bar-h) - var(--head-h));
    height: calc(100dvh - var(--bar-h) - var(--head-h));
    min-height: 440px;
    max-height: calc(100dvh - var(--bar-h) - var(--head-h));
    padding-block: clamp(12px, 2.5vh, 32px) clamp(16px, 3vh, 40px);
  }

  .hero__grid {
    grid-template-columns: 1fr;
    justify-items: center;
    row-gap: clamp(8px, 1.8vh, 18px);
  }

  .hero__dates,
  .hero__city {
    justify-self: center;
    margin-top: 0;
    transform: none;
    padding: 0;
    text-align: center;
    font-size: clamp(1rem, 2.2vh, 1.4rem);
  }

  .hero__dates {
    order: 2;
  }

  .hero__title {
    order: 1;
  }

  .hero__city {
    order: 3;
  }

  .hero__word {
    font-size: clamp(3.2rem, min(16vw, 12vh), 9.5rem);
  }

  .hero__small {
    font-size: clamp(0.85rem, 1.8vh, 1.15rem);
  }

  .hero__row--1 .hero__small {
    font-size: clamp(0.95rem, 2.1vh, 1.25rem);
  }

  .hero__art--l {
    width: clamp(180px, 36vw, 360px);
    max-height: 42vh;
  }

  .hero__art--r {
    width: clamp(200px, 42vw, 420px);
    max-height: 45vh;
  }

  .hero__cta {
    margin-top: clamp(10px, 2vh, 24px);
  }

  .intro {
    grid-template-columns: repeat(6, 1fr);
  }

  .intro__title {
    grid-column: 1 / 7;
  }

  .intro__fig--right {
    grid-column: 4 / 7;
    grid-row: 2 / 4;
    margin-top: 40px;
  }

  .intro__body {
    grid-column: 1 / 4;
    grid-row: 2;
    margin-top: 40px;
  }

  .intro__fig--left {
    display: none;
  }

  .intro__video {
    grid-column: 1 / 7;
    grid-row: 4;
  }

  .intro__mod {
    position: static;
    margin-top: 18px;
    justify-content: flex-end;
  }

  .themes__title {
    font-size: clamp(2.6rem, 11.4vw, 7rem);
  }

  .themes__list {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 28px;
    row-gap: 56px;
  }

  .theme--1,
  .theme--2,
  .theme--3,
  .theme--4 {
    grid-column: auto;
    margin-left: 0;
    margin-top: 0;
  }

  .themes__curve {
    display: none;
  }

  .venues__grid {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 28px;
    row-gap: 56px;
  }

  .venue--1,
  .venue--2,
  .venue--3,
  .venue--4 {
    grid-column: auto;
    margin-top: 0;
  }

  .explore-item {
    flex-direction: column;
    text-align: center;
    gap: 24px;
  }

  .explore-item--2 {
    flex-direction: column-reverse;
  }

  .explore-item__img-wrapper {
    max-width: 100%;
    width: 100%;
  }

  .event {
    grid-template-columns: 1fr 1.4fr;
    row-gap: 14px;
  }

  .event__desc {
    grid-column: 1 / 2;
    grid-row: 2;
    max-width: none;
  }

  .event__img {
    grid-column: 2;
    grid-row: 1 / 3;
    align-self: stretch;
    height: 100%;
    min-height: 150px;
  }

  .event__main {
    grid-column: 1;
  }

  .event__meta {
    grid-column: 1;
    grid-row: 1;
  }

  .event {
    grid-template-areas: "meta img" "main img" "desc img";
  }

  .event__meta {
    grid-area: meta;
  }

  .event__main {
    grid-area: main;
  }

  .event__desc {
    grid-area: desc;
  }

  .event__img {
    grid-area: img;
    grid-column: auto;
    grid-row: auto;
  }
}

/* ---------- Mobile ---------- */
@media (max-width: 639px) {
  :root {
    --head-h: 72px;
    --gutter: 20px;
  }

  /* a11y-bar stays a visible sticky bar on mobile, in a compact icon form.
     (The page already has a separate .skip-link, so the bar's copy is hidden here.) */
  .a11y-bar__inner {
    padding-inline: 10px;
    justify-content: center;
  }

  .a11y-bar__skip {
    display: none;
  }

  .a11y-bar__tools {
    margin: 0 auto;
    gap: 0;
  }

  .a11y-btn {
    min-width: 34px;
    padding: 0 8px;
  }

  .a11y-btn__label:not(#lang-current):not(#theme-label) {
    display: none;
  }

  .a11y-sep {
    margin-inline: 4px;
  }

  /* Dark/Light toggle shown on mobile (label: "Dark" in light mode, "Light" in dark mode). */
  #theme-toggle {
    display: inline-flex;
  }

  /* Header: Brand left, menu right */
  .site-header__inner {
    padding-inline: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .site-header__nav {
    position: absolute;
    right: 14px;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
  }

  .site-header__nav .nav-link {
    display: none;
  }

  .menu-btn {
    padding: 0;
    display: flex;
    align-items: center;
    min-height: auto;
    font-size: 0;
  }

  .menu-btn span[data-i18n="menu"] {
    display: none;
  }

  .menu-btn__bars {
    width: 28px;
    gap: 6px;
  }

  .menu-btn__bars i {
    height: 2px;
  }

  .brand {
    position: static;
    transform: none;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-right: auto;
  }

  .brand__title {
    font-size: .95rem;
    line-height: 1.1;
  }

  .brand__tag {
    display: block;
    font-size: .45rem;
    letter-spacing: 0;
    margin-top: 2px;
  }

  .brand__rule {
    height: 32px;
    width: 1px;
    background: var(--ink);
    display: block;
    margin-inline: 4px;
  }

  .brand__emblem {
    width: 22px;
    height: 26px;
  }

  .brand__ministry-text {
    font-size: .4rem;
    line-height: 1.1;
    display: flex;
    flex-direction: column;
  }

  .brand__ministry-text strong {
    font-size: .55rem;
    letter-spacing: 0;
  }

  .site-header .btn-pass {
    display: none;
  }

  /* Hero */
  .hero {
    height: auto;
    /* min-height: 100dvh; */
    max-height: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    padding-block: 0 40px;
    overflow: hidden;
    padding-top: 24px;
  }

  .hero__art {
    position: static;
    pointer-events: none;
    opacity: 1;
    max-height: none;
  }

  .hero__art--r {
    order: 1;
    align-self: flex-end;
    width: 46vw;
    margin-top: -10px;
    margin-right: -6%;
  }

  .hero__grid {
    order: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-inline: var(--gutter);
    margin-top: -11vw;
    z-index: 2;
    position: relative;
  }

  .hero__row--3 .hero__word {
    margin-left: initial;
  }

  .hero__title {
    order: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: max-content;
  }

  .hero__devanagari {
    display: block;
    font-size: clamp(2.2rem, 10vw, 2rem);
    font-family: var(--font-ui);
    font-weight: 400;
    color: var(--ink);
    margin-bottom: 4px;
    line-height: 1;
  }

  .hero__word {
    font-size: clamp(5.5rem, 26vw, 8.5rem);
    line-height: 0.9;
    color: var(--ink);
  }

  .hero__small {
    font-size: clamp(.85rem, 4vw, 1.1rem);
    color: var(--ink-soft);
    line-height: 1.25;
    text-transform: none;
    text-align: left;
  }

  .hero__grid {
    row-gap: initial;
  }

  .hero__row--1 {
    margin-left: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    width: 100%;
  }

  .hero__row--1 .hero__small {
    margin-left: 0;
    text-align: left;
    margin-top: 10px;
  }

  .hero__row--3 {
    gap: 14px;
    align-items: flex-end;
    justify-content: flex-start;
    margin-top: 16px;
    width: 100%;
  }

  .hero__row--3 .hero__small {
    padding-bottom: clamp(10px, 3vw, 24px);
    text-align: left;
    max-width: 45%;
  }

  .hero__city {
    order: 2;
    align-self: flex-end;
    width: 50%;
    text-align: center;
    color: var(--pink);
    font-family: var(--font-ui);
    font-size: clamp(1.05rem, 4.5vw, 1.45rem);
    font-weight: 500;
    margin-top: 50px;
    letter-spacing: .05em;
    transform: none;
  }

  .hero__dates {
    order: 3;
    align-self: flex-end;
    width: 50%;
    text-align: center;
    color: var(--pink);
    font-family: var(--font-ui);
    font-size: clamp(1.2rem, 4vw, 2.15rem);
    font-weight: 500;
    margin-top: 8px;
    margin-bottom: 20px;
    line-height: 1.4;
    transform: none;
    letter-spacing: 0;
  }

  .hero__art--l {
    order: 4;
    align-self: flex-start;
    width: 50vw;
    margin-top: -38vw;
    margin-bottom: 24px;
    margin-left: -5%;
    z-index: 1;
    position: relative;
  }

  .hero__cta {
    order: 5;
    margin-top: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
    padding-inline: var(--gutter);
    z-index: 3;
    position: relative;
  }

  .hero__cta .btn-pass,
  .hero__cta .btn-outline {
    width: 100%;
    max-width: none;
    min-height: 66px;
    font-size: 20px;
    font-weight: 600;
    text-transform: none;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    border-radius: 0;
    letter-spacing: 0;
    padding: 0;
    transform: none;
  }

  .hero__cta .btn-pass {
    background: var(--pink);
    color: #fff;
    border: none;
  }

  .hero__cta .btn-pass::before {
    display: none;
  }

  .hero__cta .btn-outline {
    background: transparent;
    color: var(--ink);
    border: 1px solid var(--pink);
  }

  .hero__calendar-btn {
    display: flex;
  }

  .intro {
    display: block;
    padding-block: 56px 40px;
  }

  .intro__title {
    font-size: clamp(2.4rem, 11vw, 3.4rem);
  }

  .intro__body {
    margin-top: 28px;
  }

  .intro__fig--right {
    width: 66%;
    margin: 36px 0 0 auto;
  }

  .intro__fig--left {
    display: block;
    width: 52%;
    margin: -60px 0 0 -8px;
  }

  .intro__video {
    margin-top: 36px;
    margin-inline: calc(var(--gutter) * -1);
  }

  .intro__video-frame {
    aspect-ratio: 990 / 489;
  }

  .intro__mod {
    padding-inline: var(--gutter);
  }

  .intro__tree {
    display: none;
  }

  .btn-outline {
    width: 100%;
  }

  .themes {
    padding-bottom: 70px;
  }

  .themes__title {
    white-space: normal;
    font-size: clamp(3rem, 15vw, 4.6rem);
    padding-inline: var(--gutter);
    line-height: 1.04;
  }

  .themes__list {
    grid-template-columns: 1fr;
    padding-inline: var(--gutter);
    row-gap: 52px;
    margin-top: 40px;
  }

  .theme:nth-child(even) {
    margin-left: 12%;
  }

  .theme:nth-child(odd) {
    margin-right: 12%;
  }

  .theme--2,
  .theme--4 {
    margin-top: 0;
  }

  .theme p {
    max-width: none;
    margin-top: 18px;
  }

  .venues__grid {
    grid-template-columns: 1fr;
    row-gap: 52px;
    margin-top: 40px;
  }

  .venue:nth-child(even) {
    margin-left: 12%;
  }

  .venue:nth-child(odd) {
    margin-right: 12%;
  }

  .event {
    display: block;
    padding-block: 24px;
  }

  .event__img {
    width: 100%;
    height: auto;
    aspect-ratio: 407 / 175;
    margin-top: 18px;
    min-height: 0;
  }

  .event__desc {
    margin-top: 12px;
  }

  .event__meta {
    margin-bottom: 12px;
  }

  .event__main h3 {
    margin-bottom: 12px;
  }

  .site-footer__inner {
    padding-top: 56px;
  }

  .site-footer .brand__title {
    font-size: 1.55rem;
  }

  .site-footer .brand__rule {
    height: 70px;
  }

  .site-footer .brand__ministry-text strong {
    font-size: 1.1rem;
  }

  .site-footer .brand__ministry-text {
    font-size: .76rem;
  }

  .footer-nav {
    grid-template-columns: 1fr 1fr;
  }

  .footer-base {
    margin-top: 56px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  /* Menu overlay */
  .menu-overlay__top {
    padding: 14px var(--gutter);
  }

  .menu-list a {
    gap: 14px;
  }

  .menu-list__t {
    font-size: clamp(1.4rem, min(calc((100dvh - 280px) / 14.5), 9vw), 2.8rem);
  }

  .menu-overlay__foot {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }

  .menu-overlay__foot .btn-pass {
    width: 100%;
  }
}

/* ---------- Hero: mobile + tablet (stacked reference layout) ----------
   Gate art top-right, title overlapping it, DELHI beside "The",
   dates right under the title, stepwell art left beside the dates,
   full-width buttons. Sizes derive from --hero-w so nothing overflows. */
@media (max-width: 1023px) {
  .hero {
    /* title word size: "Biennale’26" is ~4.55em wide, keep it inside the gutters */
    --hero-w: min(19.5vw, calc((100vw - 2 * var(--gutter)) / 4.6), 9rem);
    --hero-meta: clamp(1rem, 4.2vw, 1.6rem);
    /* dates / city     */
    --hero-art-r: min(46vw, 460px);
    /* gate width       */
    --hero-art-l: min(48vw, 460px);
    /* stepwell width   */
    height: auto;
    min-height: 0;
    max-height: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    padding: clamp(8px, 2.5vw, 24px) 0 clamp(36px, 6vw, 56px);
    overflow: hidden;
  }

  .hero__art {
    position: static;
    pointer-events: none;
    opacity: 1;
    max-height: none;
    object-fit: contain;
  }

  .hero__art--r {
    order: 1;
    align-self: flex-end;
    width: var(--hero-art-r);
    height: auto;
    margin: 0;
  }

  .hero__grid {
    order: 2;
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-inline: var(--gutter);
    /* Pull the title up so it overlaps the lower half of the gate (ratio 1448x1086). */
    margin-top: calc(var(--hero-art-r) * -0.36);
    row-gap: 0;
  }

  .hero__title {
    order: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: max-content;
    max-width: 100%;
  }

  .hero__word {
    font-size: var(--hero-w);
    line-height: 0.92;
    color: var(--ink);
  }

  .hero__title .hero__row:nth-child(1) {
    padding-left: calc(var(--hero-w) * 0.72);
  }

  .hero__title .hero__row:nth-child(2) {
    padding-left: calc(var(--hero-w) * 0.9) !important;
  }

  /* overrides inline 1.2em */
  .hero__title .hero__row .hero__word {
    font-size: var(--hero-w);
  }

  /* DELHI sits just left of "The" (title ≈ 4.55em wide, "The" indented 0.72em). */
  .hero__city {
    position: absolute;
    top: calc(var(--hero-w) * 0.45);
    right: calc(50% + var(--hero-w) * 1.56 + 10px);
    width: auto;
    margin: 0;
    padding: 0;
    transform: none;
    color: var(--pink);
    font-family: var(--font-ui);
    font-size: var(--hero-meta);
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1;
    text-align: right;
    white-space: nowrap;
  }

  .hero__dates {
    order: 2;
    align-self: flex-end;
    width: auto;
    margin: clamp(10px, 3vw, 22px) clamp(0px, 9vw, 120px) 0 0;
    padding: 0;
    transform: none;
    color: var(--pink);
    font-family: var(--font-ui);
    font-size: var(--hero-meta);
    font-weight: 300;
    line-height: 1.3;
    letter-spacing: 0;
    text-align: center;
  }

  /* Stepwell starts level with the dates (2 lines × 1.3 line-height). */
  .hero__art--l {
    order: 3;
    position: relative;
    z-index: 1;
    align-self: flex-start;
    width: var(--hero-art-l);
    height: auto;
    margin: calc(var(--hero-meta) * -2.6) 0 0;
  }

  .hero__cta {
    order: 4;
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 640px;
    align-self: center;
    margin-top: clamp(24px, 7vw, 48px);
    padding-inline: var(--gutter);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: clamp(10px, 2.5vw, 16px);
  }

  .hero__cta .btn-pass,
  .hero__cta .btn-outline {
    width: 100%;
    max-width: none;
    min-height: clamp(52px, 15vw, 64px);
    font-size: clamp(1rem, 4.4vw, 1.2rem);
    font-weight: 600;
    text-transform: none;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    border-radius: 0;
    letter-spacing: 0;
    padding: 0;
    transform: none;
  }

  .hero__cta .btn-pass {
    background: var(--pink);
    color: #fff;
    border: none;
    border-radius: 10px;
  }

  .hero__cta .btn-pass::before {
    display: none;
  }

  .hero__cta .btn-outline {
    border-radius: 10px;
    background: transparent;
    color: var(--ink);
    border: 1px solid var(--pink);
  }

  .hero__calendar-btn {
    display: flex;
  }
}

/* Narrow phones: keep the a11y bar on one line (language keeps its globe + chevron) */
@media (max-width: 379px) {
  #lang-current {
    display: none;
  }

  .a11y-btn {
    padding: 0 6px;
  }
}

/* ---------- Very small phones ---------- */
@media (max-width: 359px) {
  .brand__ministry {
    display: none;
  }

  .brand__rule {
    display: none;
  }

  .site-header .btn-pass {
    padding: 0 10px;
    font-size: .7rem;
  }

  .menu-btn {
    font-size: .85rem;
  }

  .footer-nav {
    grid-template-columns: 1fr;
  }
}

/* ---------- Landscape phones ---------- */
@media (max-height: 480px) and (orientation: landscape) {
  .hero {
    height: calc(100vh - var(--bar-h) - var(--head-h));
    height: calc(100dvh - var(--bar-h) - var(--head-h));
    padding-block: 4px 8px;
  }

  .hero__grid {
    row-gap: 4px;
  }

  .hero__word {
    font-size: clamp(1.8rem, 10.5vh, 3.2rem);
  }

  .hero__small {
    font-size: 0.72rem;
  }

  .hero__dates,
  .hero__city {
    font-size: 0.78rem;
  }

  .hero__cta {
    margin-top: 4px;
  }

  .hero__cta .btn-pass {
    min-height: 34px;
    font-size: 0.78rem;
  }

  .hero__art--l {
    max-height: 28vh;
  }

  .hero__art--r {
    max-height: 28vh;
  }

  .menu-list__t {
    font-size: 1.8rem;
  }

  .menu-list a {
    padding-block: 2px;
  }
}

@media print {

  .a11y-bar,
  .site-header,
  .menu-overlay,
  .soon {
    display: none !important;
  }

  .reveal,
  .reveal-line>* {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* =====================================================================
   Mobile home page (max 639px), matched to the mobile reference.
   Everything below is mobile-only; desktop/tablet rules are untouched.
   ===================================================================== */
@media (max-width: 639px) {

  /* ---------- Intro: title, video, copy, button ---------- */
  .intro {
    display: flex;
    flex-direction: column;
    padding-block: 48px 64px;
  }

  .intro__fig,
  .intro__mod,
  .intro__tree {
    display: none;
  }

  .intro__title {
    order: 1;
    font-size: clamp(2rem, 9.6vw, 2.8rem);
    font-weight: 300;
    line-height: 1.12;
    letter-spacing: -.02em;
    padding-top: 0;
  }

  .intro__title>span {
    display: block;
  }

  .intro__title strong {
    font-style: italic;
    font-weight: 300;
  }

  .intro__video {
    order: 2;
    margin: 40px 0 0;
  }

  .intro__video-frame {
    aspect-ratio: 990 / 489;
  }

  .intro__body {
    order: 3;
    margin-top: 36px;
    max-width: none;
    font-size: .95rem;
    line-height: 1.75;
  }

  .intro__body .btn-outline {
    width: auto;
    min-height: 50px;
    padding: 0 28px;
    margin-top: 28px;
    font-size: 1rem;
    border-color: var(--ink);
  }

  /* ---------- Tat Tvam Asi: scattered images around the text ---------- */
  .curatorial {
    padding-block: 64px 48px;
  }

  .curatorial__header {
    margin-bottom: 40px;
  }

  .curatorial__devanagari {
    font-size: clamp(1.6rem, 8vw, 2.1rem) !important;
    margin-bottom: .1em;
  }

  .curatorial__title {
    font-size: clamp(2.6rem, 15.5vw, 4rem) !important;
    font-weight: 300;
    letter-spacing: -.02em;
    white-space: nowrap;
  }

  .curatorial__grid {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    width: 100%;
    max-width: none;
    min-height: 0;
    /* Adjusted padding to match new uniform 47% square sizes + gap */
    padding: calc(47% + 24px) 0 calc(47% + 24px);
    gap: 0;
  }

  .curatorial__img {
    position: absolute;
    height: auto;
    border-radius: 6px;
    object-fit: cover;
    /* perfectly fills the equal-sized container */
    object-position: center;
    /* ensures the important central part is visible */
  }

  .curatorial__img--tl {
    left: 0;
    top: 0;
    width: 47%;
    aspect-ratio: 1 / 1;
  }

  .curatorial__img--tr {
    right: 0;
    top: 0;
    width: 47%;
    aspect-ratio: 1 / 1;
  }

  .curatorial__img--bl {
    left: 0;
    bottom: 0;
    width: 47%;
    aspect-ratio: 1 / 1;
  }

  .curatorial__img--br {
    right: 0;
    bottom: 0;
    width: 47%;
    aspect-ratio: 1 / 1;
  }

  .curatorial__text {
    position: relative;
    z-index: 2;
    width: 88%;
    max-width: none;
    padding: 0;
    font-size: clamp(1.25rem, 6.9vw, 1.9rem);
    line-height: 1.28;
  }

  .curatorial__cta {
    margin-top: 32px;
  }

  .curatorial__cta .btn-outline {
    width: auto;
    min-height: 0;
    padding: 6px 0;
    border: 0;
    background: none;
    color: var(--pink);
    font-family: var(--font-display);
    font-size: clamp(1.1rem, 5.2vw, 1.35rem);
    font-weight: 400;
  }

  .curatorial__cta .btn-outline::before {
    display: none;
  }

  /* ---------- Calendar of events: image-first cards ---------- */
  .events {
    padding-top: 56px;
  }

  .events__title {
    font-size: clamp(2.2rem, 10vw, 2.8rem);
    font-weight: 300;
    line-height: 1.08;
    padding-bottom: 28px;
    max-width: 8em;
  }

  .event {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 24px var(--gutter);
  }

  .event__main {
    display: contents;
  }

  .event__img {
    order: 1;
    width: 100%;
    margin: 0 0 16px;
    aspect-ratio: 350 / 150;
    min-height: 0;
  }

  .event__meta {
    order: 2;
    margin: 0 0 12px;
    padding-top: 0;
    font-size: .74rem;
    letter-spacing: .05em;
    color: var(--ink);
  }

  /* One line on mobile: "5 DEC - 8 DEC · PURANA QILA · 11:00 AM - 6 PM" (desktop keeps the <br/> stack) */
  .event__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
  }

  .event__meta br {
    display: none;
  }

  .event__meta>span::before {
    content: "\00B7";
    margin: 0 .45em;
  }

  .event--active .event__meta {
    color: var(--accent);
  }

  .event__main h3 {
    order: 3;
    margin: 0 0 12px;
    font-size: clamp(1.25rem, 6vw, 1.5rem);
    font-weight: 300;
  }

  .event__desc {
    order: 4;
    margin: 0;
    padding: 0;
    max-width: none;
    font-size: .9rem;
    line-height: 1.6;
  }

  .event__main .btn-outline,
  .event__link {
    order: 5;
    align-self: flex-start;
    border-radius: 10px;
    width: auto;
    min-height: 40px;
    margin-top: 18px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--pink);
    text-decoration: none;
    color: var(--ink);
    font-size: .82rem;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
  }

  .event__link:hover,
  .event__link:focus-visible {
    background: var(--pink);
    color: #fff;
    letter-spacing: .03em;
  }

  /* ---------- Venues: 2-column staggered masonry ---------- */
  .venues {
    padding-block: 56px 72px;
  }

  .venues__title {
    font-size: clamp(2.4rem, 12vw, 3.2rem);
    font-weight: 300;
    padding-bottom: 28px;
  }

  .venues__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto auto auto;
    column-gap: 16px;
    row-gap: 0;
    margin-top: 0;
    align-items: start;
  }

  .venue {
    margin: 0 0 28px;
  }

  .venue:nth-child(odd),
  .venue:nth-child(even) {
    margin-left: 0;
    margin-right: 0;
  }

  .venue--1 {
    grid-column: 1;
    grid-row: 1;
    margin-top: 0;
  }

  .venue--2 {
    grid-column: 2;
    grid-row: 1 / span 2;
    margin-top: 40px;
  }

  .venue--3 {
    grid-column: 1;
    grid-row: 2 / span 2;
    margin-top: 0;
  }

  .venue--4 {
    grid-column: 2;
    grid-row: 3;
    margin-top: 0;
  }

  .venue--1 .venue__img,
  .venue--3 .venue__img {
    aspect-ratio: 4 / 5;
  }

  .venue--2 .venue__img,
  .venue--4 .venue__img {
    aspect-ratio: 4 / 5;
  }

  .venue__info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 12px;
    margin-top: 14px;
  }

  .venue__name {
    font-family: var(--font-ui);
    font-size: clamp(1rem, 4.6vw, 1.2rem);
    line-height: 1.25;
  }

  .venue__link,
  .venue__link--pink {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 18px;
    border: 1px solid var(--pink);
    border-radius: 0;
    color: var(--ink);
    text-decoration: none;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .03em;
  }

  .venue__link,
  .venue__link--pink {
    border-radius: 10px !important;
  }

  .venue__link:hover,
  .venue__link--pink:hover {
    background: var(--pink);
    color: #fff;
  }

  .venues__cta {
    margin-top: 40px;
  }

  .venues__cta .btn-solid-pink {
    min-height: 52px;
    padding: 0 28px;
    font-size: 1rem;
    text-transform: none;
  }

  .social-media__nav {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 10px;
  }

  /* ---------- Featured participants: horizontal scroller ---------- */
  .featured-participants {
    padding-block: 72px 80px;
  }

  .featured-participants__header {
    margin-bottom: 28px;
  }

  .featured-participants__title {
    font-size: clamp(2.6rem, 13vw, 3.4rem);
    font-weight: 300;
    line-height: 1.05;
    margin-bottom: 16px;
  }

  .featured-participants__title em {
    display: block;
  }

  .featured-participants__subtitle {
    font-family: var(--font-display);
    font-size: clamp(1.3rem, 6.4vw, 1.65rem);
    line-height: 1.3;
  }

  .featured-participants__grid {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin-inline: calc(var(--gutter) * -1);
    padding-inline: var(--gutter);
    scroll-padding-inline: var(--gutter);
  }

  .featured-participants__grid::-webkit-scrollbar {
    display: none;
  }

  .participant-card {
    flex: 0 0 74%;
    align-items: flex-start;
    text-align: left;
    scroll-snap-align: start;
  }

  .participant-card__img-wrapper {
    max-width: none;
    margin-bottom: 12px;
  }

  .participant-card__img {
    aspect-ratio: 260 / 228;
    object-fit: cover;
  }

  .participant-card__name {
    font-size: 1rem;
  }

  .featured-participants__cta {
    margin-top: 32px;
  }

  .featured-participants__cta .btn-outline {
    width: auto;
    min-height: 52px;
    padding: 0 28px;
    font-size: 1rem;
    border-color: var(--ink-soft);
  }

  /* ---------- Leadership messages ---------- */
  .messages {
    padding: 64px var(--gutter) 72px;
    background: linear-gradient(180deg, #8f1444 0%, #2a0612 9%, #a3164c 30%, #e8337c 50%, #f0609a 75%, #ff9cc8 100%);
  }

  .curatorial__text .curotorial-name {
    margin-bottom: 30px !important;
  }

  .msg-leader {
    grid-template-columns: 1fr;
    gap: 24px;
    text-align: left;
  }

  .msg-leader__content {
    order: 1;
  }

  .msg-leader__img-wrapper {
    order: 2;
  }

  .msg-leader__img {
    aspect-ratio: 350 / 268;
    object-fit: cover;
  }

  .msg-quote-icon {
    font-size: 3.4rem;
    color: rgba(255, 255, 255, .45);
    transform: translateY(.35em);
  }

  .msg-quote-icon--end {
    display: none;
  }

  .msg-leader__quote {
    font-size: clamp(1.4rem, 6.6vw, 1.75rem);
    line-height: 1.2;
    margin: 8px 0 18px;
  }

  .msg-author__name {
    font-family: var(--font-display);
    font-size: clamp(1.1rem, 5.2vw, 1.35rem);
    font-weight: 500;
    margin-bottom: 4px;
  }

  .msg-author__title {
    font-size: .8rem;
  }

  .messages__grid {
    grid-template-columns: 1fr;
    gap: 48px;
    margin-top: 48px;
  }

  .msg-card,
  .msg-card--right {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    column-gap: 16px;
    text-align: left;
    margin-top: 0;
  }

  .msg-card__content {
    display: contents;
  }

  .msg-card__img-wrapper {
    grid-column: 1;
    grid-row: 1;
    max-width: none;
    margin: 0;
  }

  .msg-card__img {
    aspect-ratio: 110 / 122;
    object-fit: cover;
  }

  .msg-card .msg-author {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }

  .msg-card .msg-quote-icon--start {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: start;
    margin-top: 18px;
    transform: none;
    line-height: .6;
    height: .45em;
  }

  .msg-card__quote {
    grid-column: 1 / -1;
    grid-row: 3;
    margin: 14px 0 0;
    font-size: .95rem;
    line-height: 1.7;
  }
}

/* Venues (mobile): even 2-column grid, equal cards */
@media (max-width: 639px) {
  .venues .venues__grid {
    grid-template-rows: none;
    align-items: stretch;
    row-gap: 28px;
  }

  .venues .venues__grid .venue {
    grid-column: auto;
    grid-row: auto;
    margin: 0;
  }
}

/* Hero (desktop): keep "The India Biennale'26" clear of the right gate drawing.
   Drawing takes 30vw; the centred title (about 4.4em wide) is capped so its right
   edge stays at least 24px before the drawing: 9vw - 11px ≈ (20vw - 24px) / 2.2 */
@media (min-width: 1024px) {
  .hero .hero__art--r {
    width: min(30vw, 600px);
  }

  .hero .hero__word {
    font-size: clamp(4.2rem, min(calc(9vw - 11px), 18vh), 16rem);
  }
}

/* Hero (mobile/tablet): "Biennale’26" always stays on one line and fits the width.
   The line is ~4.65em wide, so the size is capped at the available width / 4.9. */
@media (max-width: 1023px) {
  .hero {
    --hero-w: min(19.5vw, calc((100vw - 2 * var(--gutter)) / 4.9), 9rem);
  }

  .hero .hero__title .hero__word {
    display: flex;
    flex-wrap: nowrap;
    white-space: nowrap;
    align-items: baseline;
  }

  .hero .hero__title .hero__word>span {
    white-space: nowrap;
  }
}

/* Hero (desktop only): T, I and B start on the same vertical line.
   Cancels the inline 1.2em indent on the "India" row. */
@media (min-width: 1024px) {
  .hero .hero__title .hero__row {
    padding-left: 0 !important;
  }
}

@media (min-width: 1024px) {

  /* italic B's ink sits ~0.05em left of its box; nudge it onto the T/I line */
  .hero .hero__title .hero__row:nth-child(3) .hero__word {
    padding-left: 0.05em;
  }
}

/* Intro video on phones: portrait mobile video (9:16) shown whole, height capped */
@media (max-width: 639px) {
  .intro .intro__video-frame.intro__video-frame--mobile {
    aspect-ratio: 9 / 16;
    /* width: min(100%, calc(78svh * 9 / 16)); */
    margin-inline: auto;
  }
}

/* ---------- Hero tagline "Art . Architecture . Design" (all devices) ---------- */
.hero .hero__tagline {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
  text-align: center;
}

/* Desktop: hero grid is [dates | title | city]; tagline goes in the title column, next row */
@media (min-width: 1024px) {
  .hero .hero__grid .hero__tagline {
    grid-column: 2;
    grid-row: 2;
    justify-self: center;
    margin-top: clamp(8px, 1.2vh, 18px);
  }

  .hero .hero__grid .hero__dates {
    grid-column: 1;
    grid-row: 1;
  }

  .hero .hero__grid .hero__title {
    grid-column: 2;
    grid-row: 1;
  }

  .hero .hero__grid .hero__city {
    grid-column: 3;
    grid-row: 1;
  }
}

/* Tablet + mobile: hero grid is a column; tagline sits right under the title */
@media (max-width: 1023px) {
  .hero .hero__grid .hero__tagline {
    order: 1;
    align-self: center;
    margin-top: 10px;
  }
}

@media (max-width: 380px) {
  .hero .hero__tagline {
    letter-spacing: 0.08em;
  }
}

/* Intro video is phone-only (also guarded in JSX) */
@media (min-width: 640px) {
  .intro .intro__video {
    display: none;
  }
}



/* FIX HEADER COLORS */


/* FIX HEADER FONTS */
.site-header a,
.site-header .nav-link,
.site-header .menu-btn,
.site-header .btn-pass {
  text-transform: none !important;
  letter-spacing: normal !important;
  font-family: var(--font-ui) !important;
  font-weight: 500 !important;
}

/* MOBILE OVERRIDES FOR IMAGE CARDS */
@media (max-width: 639px) {
  .venues .venue .venue__img-wrap .venue__img {
    object-fit: cover !important;
    aspect-ratio: 4 / 3 !important;
    height: auto;
  }

  .venue__img-wrap::before {
    display: none !important;
  }

  .venue__img-wrap::after {
    display: none !important;
  }

  .home-news .home-news__card .home-news__img-wrap {
    aspect-ratio: 4 / 3 !important;
    background: none !important;
  }

  .home-news .home-news__card .home-news__img-wrap .home-news__img {
    object-fit: cover !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: 4 / 3 !important;
  }

  .home-news .home-news__card .home-news__img-wrap::before,
  .home-news .home-news__card .home-news__img-wrap::after {
    display: none !important;
  }
}

/* Social Media Section */
.social-media {
  padding-top: clamp(40px, 4vw, 70px);
  outline: none;
  background-color: var(--bg);
  padding-inline: var(--gutter);
  margin-bottom: 60px;
}

.social-media__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 50px;
}

.social-media__title {
  font-family: var(--font-display);
  font-size: clamp(3.5rem, 6vw, 5.5rem);
  font-weight: 300;
  color: var(--ink);
  position: relative;
  display: inline-block;
  line-height: 1;
  margin: 0;
  padding-bottom: 5px;
}


.social-media__ig-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.3);
  color: var(--ink);
  transition: all 0.3s ease;
  flex-shrink: 0;
}

/* .social-media__ig-link:hover {
  background-color: var(--ink);
  color: var(--bg);
} */

.social-media__slider-container {
  width: 100%;
  position: relative;
}

.social-media__slider {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 20px;
  scroll-behavior: smooth;
}

.social-media__slider::-webkit-scrollbar {
  display: none;
}

.sm-slide {
  flex: 0 0 calc(16.666% - 17px);
  /* aspect-ratio: 1 / 1; */
  scroll-snap-align: start;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  /* background: #fff; */
  display: flex;
  align-items: center;
  justify-content: center;
  /* box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03); */
}

.sm-slide__img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  transition: transform 0.5s ease;
}

.sm-slide:hover .sm-slide__img {
  transform: scale(1.05);
}

.sm-slide__icon {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #fff;
  background: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  padding: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  display: none;
}

.social-media__nav {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 40px;
}

.sm-nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.3);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: all 0.3s ease;
}

.sm-nav-btn:hover {
  background: var(--ink);
  color: var(--bg);
}

@media (max-width: 1200px) {
  .sm-slide {
    flex: 0 0 calc(20% - 16px);
  }
}

@media (max-width: 900px) {
  .sm-slide {
    flex: 0 0 calc(25% - 15px);
  }
}

@media (max-width: 768px) {
  .sm-slide {
    flex: 0 0 calc(33.333% - 14px);
  }
}

@media (max-width: 500px) {
  .sm-slide {
    flex: 0 0 calc(50% - 10px);
  }

  .social-media__header {
    flex-direction: row;
  }
}
/* --- exhibitions.css --- */
/* =====================================================================
   Exhibitions page. Desktop first, then tablet (max 1023px) and mobile (max 639px).
   Card images share one ratio so the grid rows line up.
   ===================================================================== */
.exh {
  --exh-border: rgba(26, 10, 16, 0.22);
  --exh-card-line: rgba(26, 10, 16, 0.12);
  background: var(--bg);
  color: var(--ink);
  overflow-x: clip;
  padding-bottom: clamp(60px, 7vw, 140px);
}

[data-theme="dark"] .exh {
  --exh-border: rgba(255, 247, 233, 0.24);
  --exh-card-line: rgba(255, 247, 233, 0.14);
}

/* ---------- Title + filters ---------- */
.exh-hero {
  padding: clamp(32px, 4.2vw, 80px) var(--gutter) 0;
}

.exh-hero__title {
  margin: 0;
  font-family: "Season Mix-TRIAL", var(--font-display);
  font-weight: 300;
  font-size: clamp(3.2rem, 8.4vw, 11.5rem);
  line-height: 1;
  letter-spacing: -.02em;
}

.exh-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  margin-top: clamp(40px, 5.6vw, 110px);
  border: 1px solid var(--exh-border);
  border-radius: 2px;
}

.exh-filter {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: clamp(64px, 4.5vw, 88px);
  padding: 0 clamp(16px, 1.7vw, 32px);
  border-right: 1px solid var(--exh-card-line);
  cursor: pointer;
}

.exh-filter__label {
  font-family: var(--font-ui);
  font-size: clamp(.62rem, .6vw, .75rem);
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

.exh-filter select {
  width: 100%;
  margin-top: 4px;
  padding: 0 28px 0 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: clamp(.95rem, 1vw, 1.15rem);
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.exh-filter select:focus {
  outline: none;
}

.exh-filter:focus-within {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.exh-filter select option {
  background: var(--bg);
  color: var(--ink);
}

.exh-filter svg {
  position: absolute;
  right: clamp(16px, 1.7vw, 32px);
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.exh-clear {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 14px 0;
  padding: 0 clamp(18px, 1.7vw, 32px);
  border: 0;
  border-left: 1px solid var(--exh-card-line);
  background: transparent;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: clamp(.82rem, .8vw, .98rem);
  white-space: nowrap;
  cursor: pointer;
  transition: color .3s;
}

.exh-filters .exh-filter:nth-child(3) {
  border-right: 0;
}

.exh-clear:hover,
.exh-clear:focus-visible {
  color: var(--accent);
}

.exh-clear svg {
  transition: transform .5s var(--ease);
}

.exh-clear:hover svg {
  transform: rotate(-180deg);
}

/* ---------- Sections ---------- */
.exh-sec {
  padding: clamp(60px, 6.6vw, 130px) var(--gutter) 0;
}

.exh-sec[hidden],
.exh-card[hidden] {
  display: none;
}

.exh-sec__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: clamp(24px, 2.4vw, 44px);
}

.exh-sec__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(2.2rem, 4.6vw, 6rem);
  line-height: 1;
  letter-spacing: -.03em;
}

.exh-sec__count {
  margin: 0 0 4px;
  font-family: var(--font-ui);
  font-size: clamp(.78rem, .8vw, .98rem);
  color: var(--ink-soft);
  white-space: nowrap;
}

.exh-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(28px, 3.4vw, 64px) clamp(16px, 1.8vw, 34px);
  margin: 0;
  padding: 0;
  list-style: none;
}

/* ---------- Card ---------- */
.exh-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--exh-card-line);
  border-radius: 8px;
  background: var(--bg);
  transition: box-shadow .4s var(--ease), transform .4s var(--ease);
}

.exh-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px -24px rgba(115, 12, 57, .35);
}

.exh-card__media {
  aspect-ratio: 406 / 500;
  /* aspect-ratio: 406 / 440; */
  overflow: hidden;
}

.exh .exh-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease);
}

.exh-card:hover .exh-card__media img {
  transform: scale(1.04);
}

.exh-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: clamp(16px, 1.25vw, 24px) clamp(16px, 1.25vw, 24px) clamp(22px, 1.8vw, 34px);
}

.exh-card__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.15rem, 1.45vw, 1.75rem);
  line-height: 1.15;
  letter-spacing: -.02em;
}

.exh-card__org {
  margin: 6px 0 0;
  font-family: var(--font-ui);
  font-size: clamp(.78rem, .78vw, .95rem);
  color: var(--ink-soft);
}

.exh-card__meta {
  margin-top: clamp(14px, 1.2vw, 22px);
  padding-top: clamp(14px, 1.1vw, 20px);
  border-top: 1px solid var(--exh-card-line);
}

.exh-card__venue,
.exh-card__date {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-family: var(--font-ui);
  font-size: clamp(.78rem, .78vw, .95rem);
  line-height: 1.5;
}

.exh-card__venue {
  font-weight: 500;
}

.exh-card__date {
  margin-top: 6px;
  color: var(--ink-soft);
}

.exh-card__venue svg,
.exh-card__date svg {
  flex: 0 0 auto;
}

/* Whole card is clickable when its title links to a detail page */
.exh-card {
  position: relative;
}

.exh-card__link {
  color: inherit;
  text-decoration: none;
}

.exh-card__link::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}

.exh-card:has(.exh-card__link:focus-visible) {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.exh-card__link:focus-visible {
  outline: none;
}

.exh-empty {
  margin: 0;
  padding: clamp(60px, 6vw, 120px) var(--gutter) 0;
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.1vw, 1.3rem);
  color: var(--ink-soft);
}

/* =========================== Tablet =========================== */
@media (max-width: 1023px) {
  .exh-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .exh-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .exh-clear {
    grid-column: 1 / -1;
    justify-content: center;
    margin: 0;
    min-height: 48px;
    border-left: 0;
    border-top: 1px solid var(--exh-card-line);
  }
}

/* =========================== Mobile =========================== */
@media (max-width: 639px) {
  .exh-filters {
    grid-template-columns: 1fr;
  }

  .exh-filter {
    min-height: 62px;
    border-right: 0;
    border-bottom: 1px solid var(--exh-card-line);
  }

  .exh-filters .exh-filter:nth-child(3) {
    border-bottom: 0;
  }

  .exh-grid {
    grid-template-columns: 1fr;
  }

  .exh-sec__head {
    flex-wrap: wrap;
  }
}

@media (prefers-reduced-motion: reduce) {

  .exh-card,
  .exh .exh-card__media img,
  .exh-clear svg {
    transition: none;
  }

  .exh-card:hover,
  .exh-card:hover .exh-card__media img,
  .exh-clear:hover svg {
    transform: none;
  }
}

/* --- exhibition-detail.css --- */
/* =====================================================================
   Exhibition detail page + "How to reach" dialog.
   Sizes are taken from the 1920px reference (px / 19.2 = vw), then clamped.
   Desktop first, then tablet (max 1023px) and mobile (max 639px).
   ===================================================================== */
.exd {
  background: var(--bg);
  color: var(--ink);
  overflow-x: clip;
}

.exd img {
  display: block;
  max-width: 100%;
}

/* ---------- Pink title band ---------- */
.exd-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 32%);
  gap: 32px;
  min-height: clamp(280px, 22.4vw, 520px);
  padding: clamp(36px, 4.6vw, 100px) var(--gutter) clamp(40px, 4vw, 90px);
  background: var(--pink);
  color: #fff;
}

.exd-hero__by {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(.95rem, 1.05vw, 1.4rem);
  letter-spacing: -.01em;
}

.exd-hero__title {
  max-width: 9ch;
  margin: clamp(10px, .9vw, 18px) 0 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(2.6rem, 3.96vw, 5.6rem);
  line-height: 1.18;
  letter-spacing: -.035em;
}

.exd-hero__side {
  padding-top: clamp(0px, 1.2vw, 30px);
}

.exd-hero__dates {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.2rem, 1.9vw, 2.9rem);
  line-height: 1.15;
  letter-spacing: -.035em;
}

.exd-hero__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(180px, 13.6vw, 300px);
  height: clamp(48px, 3.35vw, 72px);
  margin-top: clamp(20px, 1.7vw, 36px);
  border: 1px solid rgba(255, 255, 255, .92);
  color: #fff;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(.88rem, .9vw, 1.15rem);
  letter-spacing: -.01em;
  text-decoration: none;
  transition: background-color .3s, color .3s;
  border-radius : 10px;
}

.exd-hero__btn:hover,
.exd-hero__btn:focus-visible {
  background: #fff;
  color: var(--pink);
}

/* ---------- Cover image ---------- */
.exd-cover {
  margin: 0;
  aspect-ratio: 1920 / 1000;
  overflow: hidden;
  background: var(--tint);
}

.exd .exd-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---------- Body: text + details ---------- */
.exd-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 26.5%);
  gap: 48px;
  padding: clamp(56px, 5.2vw, 110px) var(--gutter) clamp(64px, 5.6vw, 120px);
}

.exd-body__main {
  max-width: 860px;
}

.exd-block+.exd-block {
  margin-top: clamp(56px, 5.6vw, 116px);
}

.exd-block--narrow {
  max-width: 740px;
}

.exd-block__title {
  margin: 0 0 clamp(10px, .9vw, 18px);
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.6rem, 1.77vw, 2.4rem);
  line-height: 1.2;
  letter-spacing: -.03em;
}

.exd-block p {
  margin: 0;
  font-family: var(--font-ui);
  font-size: clamp(.95rem, .94vw, 1.2rem);
  line-height: 1.78;
  color: var(--ink);
}

.exd-block p+p {
  margin-top: clamp(28px, 2.8vw, 56px);
}

.exd-info__item+.exd-info__item {
  margin-top: clamp(40px, 4.4vw, 90px);
}

.exd-info__item--share {
  margin-top: clamp(64px, 8vw, 160px) !important;
}

.exd-info__label {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(1.4rem, 1.56vw, 2.1rem);
  line-height: 1.2;
  letter-spacing: -.04em;
}

.exd-info__value {
  margin: clamp(6px, .6vw, 12px) 0 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.25rem, 1.46vw, 1.95rem);
  line-height: 1.22;
  letter-spacing: -.01em;
}

.exd-info__reach {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 6px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--accent);
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(.92rem, .94vw, 1.2rem);
  cursor: pointer;
}

.exd-info__reach svg {
  transition: transform .3s var(--ease);
}

.exd-info__reach:hover svg,
.exd-info__reach:focus-visible svg {
  transform: translateX(4px);
}

.exd-share {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1vw, 20px);
  margin: clamp(12px, 1vw, 20px) 0 0;
  padding: 0;
  list-style: none;
}

.exd-share a {
  display: grid;
  place-items: center;
  color: var(--ink);
  transition: color .3s, transform .3s var(--ease);
}

.exd-share a:hover,
.exd-share a:focus-visible {
  color: var(--accent);
  transform: translateY(-2px);
}

/* ---------- Album (always dark, as in the reference) ---------- */
.exd-album {
  padding: clamp(56px, 5vw, 110px) var(--gutter) clamp(72px, 6.6vw, 140px);
  background: #000;
  color: #fff;
}

.exd-album__title {
  margin: 0;
  font-family: "Season Mix-TRIAL", var(--font-display);
  font-weight: 300;
  font-size: clamp(3rem, 5.2vw, 7.4rem);
  line-height: 1;
  letter-spacing: -.03em;
}

.exd-album__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 1.7vw, 36px);
  margin: clamp(32px, 3.2vw, 64px) 0 0;
  padding: 0;
  list-style: none;
}

.exd-album figure {
  margin: 0;
}

.exd .exd-album img {
  width: 100%;
  /* keep alt text from showing if a file is missing */
  color: transparent;
  font-size: 0;
  aspect-ratio: 405 / 502;
  object-fit: cover;
  background: #141414;
}

.exd-album figcaption {
  margin-top: clamp(10px, .8vw, 16px);
  font-family: var(--font-ui);
  font-size: clamp(.82rem, .88vw, 1.1rem);
  color: rgba(255, 255, 255, .62);
}

/* ---------- Visit dialog ---------- */
html.exd-lock {
  overflow: hidden;
}

.exd-visit {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: clamp(16px, 4vh, 56px) 16px;
  border: 0;
  background: transparent;
  color: var(--ink);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.exd-visit[open] {
  display: grid;
  justify-items: center;
  align-items: start;
}

.exd-visit::backdrop {
  background: rgba(24, 4, 14, .52);
  backdrop-filter: blur(2px);
}

.exd-visit[open] .exd-visit__panel {
  animation: exd-in .38s var(--ease) both;
}

.exd-visit[open]::backdrop {
  animation: exd-fade .3s ease both;
}

.exd-visit.is-closing .exd-visit__panel {
  animation: exd-out .22s ease both;
}

.exd-visit.is-closing::backdrop {
  animation: exd-fade .22s ease reverse both;
}

@keyframes exd-in {
  from {
    opacity: 0;
    transform: translateY(24px) scale(.985);
  }
}

@keyframes exd-out {
  to {
    opacity: 0;
    transform: translateY(12px) scale(.99);
  }
}

@keyframes exd-fade {
  from {
    opacity: 0;
  }
}

.exd-visit__panel {
  width: min(1280px, 100%);
  outline: none;
  margin: auto 0;
  border-radius: 16px;
  background: #FFF7E9;
  box-shadow: 0 40px 90px -30px rgba(40, 4, 20, .45);
}

[data-theme="dark"] .exd-visit__panel {
  background: #1d1712;
}

.exd-visit__head {
  position: relative;
  padding: 44px 48px 38px;
  border-bottom: 1px solid #F0E2C8;
}

[data-theme="dark"] .exd-visit__head {
  border-color: var(--line);
}

.exd-visit__eyebrow {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--accent);
}

.exd-visit__title {
  margin: 10px 0 0;
  padding-right: 64px;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.9rem, 2.6vw, 3rem);
  line-height: 1.12;
  letter-spacing: -.045em;
}

.exd-visit__loc {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 14px 0 0;
  font-family: var(--font-ui);
  font-size: 18px;
  color: var(--ink-soft);
}

.exd-visit__close {
  position: absolute;
  top: 40px;
  right: 48px;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(26, 10, 16, .32);
  border-radius: 50%;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  transition: background-color .3s, color .3s, border-color .3s, transform .4s var(--ease);
}

[data-theme="dark"] .exd-visit__close {
  border-color: var(--line);
}

.exd-visit__close:hover,
.exd-visit__close:focus-visible {
  background: var(--pink);
  border-color: var(--pink);
  color: #fff;
  transform: rotate(90deg);
}

.exd-visit__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 420px;
  gap: 32px;
  padding: 36px 48px 48px;
}

.exd-visit__modes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.exd-mode {
  padding: 24px 24px 26px;
  border: 1px solid #F1E2C4;
  border-radius: 12px;
  background: #FFFBF4;
}

[data-theme="dark"] .exd-mode {
  border-color: var(--line);
  background: #251d17;
}

.exd-mode__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 12px;
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: -.01em;
  color: var(--ink);
}

.exd-mode__title svg,
.exd-mode__icon {
  flex: 0 0 auto;
  color: var(--pink);
}

.exd-mode p {
  margin: 0;
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.53;
  color: var(--ink-soft);
}

.exd-mode--access {
  grid-column: 1 / -1;
  display: flex;
  gap: 18px;
  padding: 22px 24px 26px;
  border-color: transparent;
  background: #FAEDD6;
}

[data-theme="dark"] .exd-mode--access {
  background: #2e2318;
}

.exd-mode--access .exd-mode__title {
  margin-bottom: 8px;
}

.exd-mode--access .exd-mode__icon {
  margin-top: 1px;
}

/* ASI panel: mauve to pink to near-black, as in the reference */
.exd-asi {
  position: relative;
  overflow: hidden;
  padding: 32px 32px 36px;
  border-radius: 12px;
  color: #fff;
  background:
    radial-gradient(120% 60% at 0% 0%, rgba(160, 92, 122, .95), transparent 60%),
    linear-gradient(180deg, #9c4f72 0%, #c63c74 30%, #ea2a74 46%, #7a0f3c 70%, #1a0309 84%, #6b0b33 100%);
}

.exd-asi__eyebrow {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0;
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .82);
}

.exd-asi__title {
  margin: 22px 0 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: 36px;
  line-height: 1.1;
  letter-spacing: -.045em;
}

.exd-asi__intro {
  margin: 16px 0 0;
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.53;
  color: rgba(255, 255, 255, .86);
}

.exd-asi__list {
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
  counter-reset: asi;
}

.exd-asi__list li {
  display: grid;
  grid-template-columns: 34px 1fr;
  padding: 16px 0 17px;
  border-top: 1px solid rgba(255, 255, 255, .2);
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.53;
  counter-increment: asi;
}

.exd-asi__list li:first-child {
  padding-top: 0;
  border-top: 0;
}

.exd-asi__list li::before {
  content: counter(asi, decimal-leading-zero);
  font-family: "Season Mix-TRIAL", var(--font-display);
  font-weight: 300;
  font-size: 18px;
  line-height: 1.3;
  color: rgba(255, 255, 255, .7);
}

.exd-asi__note {
  margin: 22px 0 0;
  padding-top: 0;
  font-family: var(--font-ui);
  font-size: 11px;
  line-height: 1.55;
  color: rgba(255, 255, 255, .55);
}

/* =========================== Tablet =========================== */
@media (max-width: 1023px) {
  .exd-hero {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .exd-hero__title {
    max-width: 12ch;
  }

  .exd-body {
    grid-template-columns: 1fr;
    gap: 56px;
  }

  .exd-info {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px 32px;
    padding-top: 40px;
    border-top: 1px solid var(--line);
  }

  .exd-info__item+.exd-info__item,
  .exd-info__item--share {
    margin-top: 0 !important;
  }

  .exd-album__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 32px;
  }

  .exd-visit__body {
    grid-template-columns: 1fr;
  }
}

/* =========================== Mobile =========================== */
@media (max-width: 639px) {
  .exd-cover {
    aspect-ratio: 4 / 3;
  }

  .exd-info {
    grid-template-columns: 1fr;
  }
.exd-hero__dates{
  font-size : clamp(1.2rem, 1.9vw, 2.2rem) !important;
}
  .exd-visit {
    padding: 12px 10px;
  }

  .exd-visit__head {
    padding: 28px 22px 24px;
  }

  .exd-visit__close {
    top: 20px;
    right: 18px;
    width: 42px;
    height: 42px;
  }

  .exd-visit__title {
    padding-right: 48px;
  }

  .exd-visit__loc {
    font-size: 16px;
  }

  .exd-visit__body {
    padding: 22px 16px 22px;
    gap: 16px;
  }

  .exd-visit__modes {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .exd-mode {
    padding: 20px;
  }

  .exd-mode__title {
    font-size: 18px;
  }

  .exd-asi {
    padding: 26px 22px 28px;
  }

  .exd-asi__title {
    font-size: 30px;
  }
}

@media (prefers-reduced-motion: reduce) {

  .exd-visit[open] .exd-visit__panel,
  .exd-visit[open]::backdrop,
  .exd-visit.is-closing .exd-visit__panel,
  .exd-visit.is-closing::backdrop {
    animation: none;
  }

  .exd-info__reach svg,
  .exd-share a,
  .exd-visit__close {
    transition: none;
  }
}

/* --- home-canvas.css --- */
/* =====================================================================
   Home: "For 108 days, Delhi's Monuments becomes the Canvas."
   Positions come from the reference as a share of the viewport width (vw).
   Desktop first, then tablet (max 1023px) and mobile (max 639px).
   ===================================================================== */
.cnv {
  position: relative;
  min-height: 68.4vw;
  padding: 9vw 0 10.5vw;
  overflow: hidden;
  background: var(--bg);
  color: var(--ink);
  isolation: isolate;
}

/* Lotus: top-right, bleeding off the edge. Its cream backdrop is baked in,
   so darken (keep the darker channel) makes it vanish into the page */
.cnv__lotus {
  position: absolute;
  top: -.6vw;
  right: 0;
  z-index: -1;
  width: 31.7vw;
  height: auto;
  mix-blend-mode: darken;
  pointer-events: none;
}

[data-theme="dark"] .cnv__lotus {
  filter: invert(1);
  mix-blend-mode: screen;
  opacity: .55;
}

/* Qutub Minar: bottom-left, anchored to the section floor */
.cnv__qutub {
  position: absolute;
  left: 5.7vw;
  bottom: 0;
  z-index: -1;
  width: 39.6vw;
  height: auto;
  pointer-events: none;
}

[data-theme="dark"] .cnv__qutub {
  filter: invert(1) hue-rotate(180deg) brightness(1.1);
  mix-blend-mode: screen;
  opacity: .7;
}

.cnv__title {
  margin: 0 0 0 19.2vw;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(2rem, 3.55vw, 5.4rem);
  line-height: 1.13;
  letter-spacing: -.035em;
  color: var(--ink);
}

.cnv__title span {
  display: block;
}

.cnv__title strong {
  font-weight: 400;
}

.cnv__body {
  width: 28vw;
  margin: 5.6vw 0 0 41.5vw;
  font-family: var(--font-ui);
}

.cnv__lead,
.cnv__text {
  margin: 0;
  font-size: clamp(.8rem, .9vw, 1.2rem);
  line-height: 1.55;
  color: var(--ink-soft);
}

.cnv__quote {
  margin: 2.1vw 0;
  padding: 0;
}

.cnv__quote p {
  margin: 0;
  font-weight: 300;
  font-size: clamp(1.35rem, 2.5vw, 3.6rem);
  line-height: 1.24;
  letter-spacing: -.035em;
  color: var(--pink);
}

[data-theme="dark"] .cnv__quote p {
  color: var(--accent);
}

.cnv__quote span,
.cnv__quote em {
  display: block;
}

.cnv__quote em {
  font-style: italic;
}

.cnv__credit {
  margin: 1.9vw 0 0;
  font-size: clamp(.94rem, .98vw, .15rem);
  line-height: 1.75;
  color: var(--ink-soft);
}

.cnv__credit strong {
  display: block;
  font-weight: 500;
  color: var(--ink);
}

/* =========================== Tablet =========================== */
@media (max-width: 1023px) {
  .cnv {
    min-height: 0;
    padding: clamp(64px, 9vw, 96px) var(--gutter) 54vw;
  }

  .cnv__lotus {
    width: 36vw;
  }

  .cnv__title {
    margin-left: 6vw;
    font-size: clamp(2rem, 5vw, 3rem);
  }

  .cnv__body {
    width: auto;
    max-width: 520px;
    margin: clamp(32px, 5vw, 56px) 0 0 auto;
  }

  .cnv__lead,
  .cnv__text {
    font-size: clamp(.9rem, 1.7vw, 1rem);
  }

  .cnv__quote {
    margin: 24px 0;
  }

  .cnv__quote p {
    font-size: clamp(1.5rem, 3.6vw, 2.2rem);
  }

  .cnv__credit {
    margin-top: 22px;
    font-size: .78rem;
  }

  .cnv__qutub {
    left: 0;
    width: 56vw;
  }
}

/* =========================== Mobile =========================== */
@media (max-width: 639px) {
  /* Lotus sits above the heading (top-right) so it never runs behind the text */
  .cnv {
    display: flex;
    flex-direction: column;
    padding-top : 30px;
    padding-bottom : 30px;
    /* padding: 44vw var(--gutter) 0; */
  }

  .cnv__lotus {
    top: 0;
    width: 44vw;
  }

  .cnv__title {
    max-width: 78%;
    margin: 0;
    font-size: clamp(1.9rem, 8.6vw, 2.5rem);
  }

  .cnv__body {
    max-width: none;
    margin: 32px 0 0;
  }

  .cnv__lead,
  .cnv__text {
    font-size: .95rem;
  }

  .cnv__quote p {
    font-size: clamp(1.5rem, 7vw, 1.9rem);
  }

  /* In flow below the text: whole drawing, never cropped */
  .cnv__qutub {
    position: relative;
    left: auto;
    order: 3;
    align-self: flex-start;
    width: min(100%, 420px);
    margin: 28px 0 0 calc(var(--gutter) * -1);
  }
}

/* --- home-tat-tvam-asi.css --- */
/* =====================================================================
   Home: "तत् त्वम् असि / Tat Tvam Asi" on a magenta field.
   Desktop positions come from the reference as vw; the sculpture (n1.png)
   is tinted by blending its luminosity into the gradient behind it.
   Desktop (min 1024px), then a stacked tablet/mobile composition.
   ===================================================================== */
.tta {
  --tta-ink: #FBE4E6;
  --tta-title: #F6D2D4;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 55.8vw;
  padding-bottom: 4.5vw;
  color: var(--tta-ink);
  background:
    radial-gradient(60% 70% at 100% 100%, rgba(232, 30, 118, .9), transparent 70%),
    linear-gradient(112deg, #640830 0%, #7a0b3b 30%, #8f0f47 52%, #b1145a 74%, #d81a6e 100%);
}

/* Red glow behind the mirror (the sun in n1.png loses its colour once greyscaled) */
.tta::before {
  content: "";
  position: absolute;
  left: 44vw;
  top: 8vw;
  z-index: -2;
  width: 30vw;
  height: 30vw;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(214, 26, 42, .55), rgba(190, 18, 60, .25) 55%, transparent 100%);
  pointer-events: none;
}

/* Sculpture: greyscale + soft-light, so it only shades the magenta field
   (low-contrast, embossed look of the reference) instead of replacing it */
.tta__art {
  position: absolute;
  bottom: 0;
  left: 18.4vw;
  z-index: -1;
  width: 55vw;
  max-width: none;
  height: auto;
  filter: grayscale(1) contrast(.9) brightness(.98);
  mix-blend-mode: soft-light;
  opacity: .72;
  pointer-events: none;
}

/* ---------- Heading lockup ---------- */
/* Head + lead share one column (left 13.2vw, ~15vw wide) that clears the statue */
.tta__head {
  position: absolute;
  top: 8.6vw;
  left: 13.2vw;
  width: 15vw;
  text-align: center;
}

.tta__deva {
  margin: 0;
  font-family: "Nirmala UI", "Mangal", "Noto Sans Devanagari", var(--font-ui);
  font-weight: 400;
  font-size: clamp(1rem, 1.8vw, 2.4rem);
  line-height: 1.2;
  color: var(--tta-ink);
}

/* Reference is a tight, interlocking logotype: upright high-contrast serif,
   lines stacked so they touch, last word in capitals, warm blush colour */
.tta__title {
  margin: 2.2vw 0 0;
  font-family: "Fraunces", var(--font-display);
  font-optical-sizing: auto;
  font-variation-settings: "opsz" 144;
  font-weight: 400;
  font-size: clamp(3.2rem, 6.2vw, 8.4rem);
  line-height: .76;
  letter-spacing: -.035em;
  color: #E9C9C6;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .18), 0 2px 10px rgba(60, 0, 20, .25);
}

.tta__title span,
.tta__title em {
  display: block;
}

.tta__title span:first-child {
  padding-left: .3em;
}

.tta__title em {
  margin-top: .02em;
  font-style: normal;
  font-size: .9em;
  letter-spacing: -.02em;
  text-transform: uppercase;
}

/* ---------- Text ---------- */
.tta__lead,
.tta__invite {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1rem, 1.49vw, 2rem);
  line-height: 1.36;
  letter-spacing: -.02em;
  color: var(--tta-ink);
}

.tta__lead {
  position: absolute;
  top: 29.8vw;
  left: 13.2vw;
  width: max-content;
  font-size: clamp(1rem, 1.4vw, 1.9rem);
}

/* In flow (not absolute) so the section grows if the text wraps more */
.tta__side {
  position: relative;
  width: 19.7vw;
  margin: 29.8vw 12.7vw 0 auto;
  text-align: right;
}

.tta__invite {
  width: max-content;
  max-width: none;
  font-size: clamp(1rem, 1.49vw, 2rem);
  margin-left: auto;
}

.tta__desc {
  margin: 1.7vw 0 0;
  font-family: var(--font-ui);
  font-size: clamp(.66rem, .78vw, 1.05rem);
  line-height: 1.78;
  color: rgba(251, 228, 230, .88);
}

.tta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14.7vw;
  min-width: 170px;
  height: 3.25vw;
  min-height: 40px;
  margin-top: 3.2vw;
  border: 1px solid rgba(251, 228, 230, .7);
  color: var(--tta-ink);
  font-family: var(--font-ui);
  font-size: clamp(.74rem, .76vw, 1.05rem);
  text-decoration: none;
  letter-spacing: .01em;
  transition: background-color .3s, color .3s, border-color .3s;
  border-radius : 10px;
}

.tta__btn:hover,
.tta__btn:focus-visible {
  background: var(--tta-ink);
  border-color: var(--tta-ink);
  color: #8f0f47;
}

.tta__btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

/* ================= Tablet + mobile: stacked composition ================= */
@media (max-width: 1023px) {
  /* desktop keeps the reference line breaks; smaller screens reflow */
  .tta__br {
    display: none;
  }

  /* glow is placed for the desktop composition only */
  .tta::before {
    display: none;
  }

  .tta {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: clamp(56px, 9vw, 88px) var(--gutter) clamp(56px, 9vw, 88px);
  }

  .tta__head {
    position: relative;
    top: auto;
    left: auto;
    z-index: 1;
    width: auto;
    align-self: flex-start;
  }

  .tta__title {
    margin-top: 18px;
    font-size: clamp(3.4rem, 11vw, 6rem);
  }

  /* Whole sculpture, in flow, tucked up under the lockup */
  .tta__art {
    position: relative;
    top: auto;
    left: auto;
    order: 1;
    align-self: center;
    width: min(100%, 680px);
    margin: clamp(-150px, -16vw, -60px) 0 0 12%;
    /* the sculpture is cut flat at its base: fade it out instead of a hard edge */
    -webkit-mask-image: linear-gradient(180deg, #000 78%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 78%, transparent 100%);
  }

  .tta__lead {
    position: relative;
    top: auto;
    left: auto;
    order: 2;
    width: auto;
    max-width: 22ch;
    margin-top: 8px;
    font-size: clamp(1.3rem, 3.4vw, 1.75rem);
  }

  .tta__side {
    order: 3;
    width: auto;
    max-width: 440px;
    margin: 36px 0 0 auto;
  }

  .tta__invite {
    width: auto;
    max-width: 20ch;
    font-size: clamp(1.3rem, 3.4vw, 1.75rem);
  }

  .tta__desc {
    margin-top: 18px;
    font-size: clamp(.86rem, 1.9vw, .95rem);
    line-height: 1.7;
  }

  .tta__btn {
    width: auto;
    height: 48px;
    margin-top: 26px;
    padding: 0 28px;
    font-size: .9rem;
  }
}

@media (max-width: 639px) {
  .tta__art {
    width: calc(100% + var(--gutter));
    margin: -48px calc(var(--gutter) * -1) 0 0;
  }

  .tta__side {
    margin-top: 32px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tta__btn {
    transition: none;
  }
}

/* --- home-explore-cards.css --- */
/* =====================================================================
   Home Explore cards. Card = 406 x 579 in the 1920px reference; everything
   inside is sized in cqi (1cqi = 1% of card width) so cards scale as one
   piece at every column count. r1–r4 have transparent backgrounds; each
   image's printed label sits under the bottom panel, as in the reference.
   ===================================================================== */
.exp-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 1.62vw, 36px);
}

.exp-card {
  --exp-bg: #FFB42D;
  --exp-panel: #DF8E00;
  --img-w: 93%;
  --img-x: 3.9%;
  --img-y: -2.8%;
  position: relative;
  display: block;
  aspect-ratio: 406 / 579;
  overflow: hidden;
  container-type: inline-size;
  border-radius: 16px;
  background: var(--exp-bg);
  color: #FFF7E9;
  text-decoration: none;
  isolation: isolate;
}

.exp-card--purple {
  --exp-bg: #995C89;
  --exp-panel: #5F178D;
  --img-w: 88%;
  --img-x: 5.7%;
  --img-y: 2.2%;
}

.exp-card--green {
  --exp-bg: #37B06E;
  --exp-panel: #0E5E53;
  --img-w: 87%;
  --img-x: 8.9%;
  --img-y: -2.6%;
}

.exp-card--pink {
  --exp-bg: #FD4B9E;
  --exp-panel: #D91895;
  --img-w: 74.6%;
  --img-x: 9.9%;
  --img-y: -2.2%;
}

/* Whole image, natural ratio, no overlay */
.iaadb-layout__main .exp-card__img {
  position: absolute;
  top: var(--img-y);
  left: var(--img-x);
  z-index: 0;
  width: var(--img-w);
  height: auto;
  max-width: none;
  filter: none;
  outline: 0;
  transform-origin: 50% 70%;
  transition: transform .9s var(--ease);
}

.exp-card:hover .exp-card__img,
.exp-card:focus-visible .exp-card__img {
  filter: none;
  transform: scale(1.035);
}

.exp-card__panel {
  position: absolute;
  inset: auto 0 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  /* grows with its text so a 3-line description never touches the edge */
  min-height: 29.5%;
  padding: 7.4cqi 9.85cqi max(22px, 7.4cqi);
  border-radius: 16px;
  background: var(--exp-panel);
}

.exp-card__name {
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: max(1.5rem, 10.3cqi);
  line-height: 1.05;
  letter-spacing: -.03em;
  transition: opacity .4s var(--ease);
}

.exp-card__desc {
  margin-top: 4.9cqi;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: max(.82rem, 3.7cqi);
  line-height: 1.53;
  transition: opacity .4s var(--ease);
}

/* Hover state from the reference (Experiences card): spinning ring, text recedes */
.exp-card__badge {
  position: absolute;
  top: 55.5%;
  left: 56%;
  z-index: 3;
  width: 34.5%;
  height: auto;
  overflow: visible;
  opacity: 0;
  transform: scale(.8) rotate(-40deg);
  transition: opacity .45s var(--ease), transform .7s var(--ease);
  pointer-events: none;
}

.exp-card__badge text {
  fill: #fff;
  font-family: var(--font-ui);
  font-size: 9.4px;
  font-weight: 500;
  letter-spacing: .14em;
}

.exp-card:hover .exp-card__badge,
.exp-card:focus-visible .exp-card__badge {
  opacity: 1;
  transform: scale(1) rotate(0);
  animation: exp-spin 14s linear .7s infinite;
}

.exp-card:hover .exp-card__name,
.exp-card:hover .exp-card__desc,
.exp-card:focus-visible .exp-card__name,
.exp-card:focus-visible .exp-card__desc {
  opacity: .55;
}

@keyframes exp-spin {
  to {
    transform: scale(1) rotate(360deg);
  }
}

.exp-card:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 4px;
}

/* =========================== Tablet =========================== */
@media (max-width: 1023px) {
  .exp-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }
}

/* =========================== Mobile =========================== */
@media (max-width: 639px) {
  .exp-grid {
    grid-template-columns: minmax(0, 420px);
    justify-content: center;
    gap: 20px;
  }
}

/* No hover on touch: keep text at full strength, no ring */
@media (hover: none) {

  .exp-card:hover .exp-card__name,
  .exp-card:hover .exp-card__desc {
    opacity: 1;
  }

  .exp-card:hover .exp-card__badge {
    opacity: 0;
    animation: none;
  }
}

@media (prefers-reduced-motion: reduce) {

  .iaadb-layout__main .exp-card__img,
  .exp-card__badge {
    transition: none;
  }

  .exp-card:hover .exp-card__img {
    transform: none;
  }

  .exp-card:hover .exp-card__badge,
  .exp-card:focus-visible .exp-card__badge {
    animation: none;
  }
}

/* --- home-venues-button.css --- */
/* "View All Venues": thin outlined box, square corners, sentence case */
.venues__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: clamp(200px, 11.4vw, 260px);
  min-height: clamp(48px, 2.75vw, 60px);
  padding: 0 32px;
  border: 1px solid rgba(26, 10, 16, .45);
  border-radius: 10px;
  background: transparent;
  color: var(--ink);
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(.95rem, .8vw, 1.1rem);
  letter-spacing: -.01em;
  text-decoration: none;
  transition: background-color .3s, color .3s, border-color .3s;
}

.venues__btn:hover,
.venues__btn:focus-visible {
  background: var(--pink);
  border-color: var(--pink);
  color: #fff;
}

[data-theme="dark"] .venues__btn {
  border-color: var(--line);
}

/* --- home-calendar-banner.css --- */
/* =====================================================================
   Home: "Calendar of Events" banner. Sizes from the 1734px reference
   (px / 17.34 = vw). The collage (h1.png, transparent) spills past the
   rounded panel and is clipped only by the section edge, as in the
   reference. Desktop first; stacks below 900px.
   ===================================================================== */
.cal {
  position: relative;
  overflow: clip;
  padding: 2.65vw 0 2.55vw 4.2vw;
  background: var(--bg);
}

.cal__box {
  position: relative;
  width: 83.6vw;
  max-width: calc(100% - 7vw);
  min-height: 22.1vw;
  border: 1px solid #EFE2CB;
  border-radius: clamp(24px, 2.3vw, 44px);
  background: linear-gradient(90deg, #FFEDCD 0%, #FFEFD3 55%, #FFF2DB 100%);
}

.cal__text {
  position: relative;
  z-index: 1;
  padding: 4.15vw 0 3.9vw 4.5vw;
}

.cal__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.5rem, 2.2vw, 3rem);
  line-height: 1.2;
  letter-spacing: -.035em;
  color: var(--ink);
}

.cal__title em {
  font-style: italic;
}

.cal__dates {
  margin: .4vw 0 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.7rem, 2.9vw, 4rem);
  line-height: 1.2;
  letter-spacing: -.045em;
  color: var(--ink);
}

.cal__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(200px, 15.1vw, 300px);
  height: clamp(48px, 3.63vw, 70px);
  margin-top: clamp(28px, 3.5vw, 64px);
  border: 1px solid rgba(26, 10, 16, .55);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: clamp(.92rem, .92vw, 1.15rem);
  text-decoration: none;
  letter-spacing: -.01em;
  transition: background-color .3s, color .3s, border-color .3s;
  border-radius : 10px;
}

.cal__btn:hover,
.cal__btn:focus-visible {
  background: var(--pink);
  border-color: var(--pink);
  color: #fff;
}

/* Collage: overhangs the panel top and right */
.iaadb-layout__main .cal__art {
  position: absolute;
  top: -7.04vw;
  left: 59.2%;
  z-index: 0;
  width: 48.1%;
  height: auto;
  max-width: none;
  filter: none;
  outline: 0;
  pointer-events: none;
}

[data-theme="dark"] .cal__box {
  border-color: var(--line);
  background: linear-gradient(90deg, #2a1f14 0%, #2c2117 100%);
}

[data-theme="dark"] .cal__btn {
  border-color: var(--line);
}

/* ============== Tablet + mobile: text on top, whole collage below ============== */
@media (max-width: 899px) {
  .cal {
    padding: 48px var(--gutter);
  }

  .cal__box {
    width: auto;
    max-width: none;
    min-height: 0;
    padding: 0 0 8px;
    overflow: hidden;
  }

  .cal__text {
    padding: 36px 28px 0;
  }

  .cal__dates {
    margin-top: 6px;
  }

  .cal__btn {
    margin-top: 28px;
  }

  .iaadb-layout__main .cal__art {
    position: relative;
    top: auto;
    left: auto;
    display: block;
    width: min(100%, 520px);
    margin: 12px auto 0;
  }
}

@media (max-width: 639px) {
  .cal__text {
    padding: 28px 22px 0;
  }

  .cal__title {
    font-size: 1.45rem;
  }

  .cal__dates {
    font-size: clamp(1.45rem, 7vw, 1.9rem);
  }

  .cal__btn {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cal__btn {
    transition: none;
  }
}

/* keep each date whole when the range wraps on small screens */
.cal__dates time {
  white-space: nowrap;
}

/* Tat Tvam Asi lettering image (tatvam.png has ~11% transparent padding each side,
   so it is drawn wider than the column and pulled back to centre the lettering) */
.tta__title {
  margin-top: 1.2vw;
  line-height: 0;
  text-shadow: none;
}

.iaadb-layout__main .tta__logo {
  display: block;
  width: 19vw;
  max-width: none;
  height: auto;
  margin: 0 -2vw;
  filter: none;
  outline: 0;
}

@media (max-width: 1023px) {
  .iaadb-layout__main .tta__logo {
    width: clamp(220px, 38vw, 340px);
    margin: 0 0 0 -6%;
  }
}

/* --- home-leadership.css --- */
/* =====================================================================
   Home: leadership messages on a warm umber field. Positions from the
   reference as % of section width: PM row on top; two staggered cards
   below (right card sits lower). Desktop first; stacks below 900px.
   ===================================================================== */
.ldr {
  --ldr-ink: #2b1e16;
  --ldr-soft: rgba(43, 30, 22, .75);
  --ldr-quote: #d6457f;
  display: grid;
  grid-template-columns: 12.7% 28.5% 14.5% 29.5% 14.8%;
  grid-template-rows: auto auto auto;
  row-gap: 0;
  padding: 8.5vw 0 7vw;
  color: var(--ldr-ink);
  background:
    radial-gradient(55% 45% at 20% 18%, rgba(250, 236, 212, .6), transparent 70%),
    radial-gradient(50% 50% at 85% 75%, rgba(226, 196, 152, .5), transparent 70%),
    radial-gradient(60% 40% at 50% 50%, rgba(246, 226, 194, .35), transparent 75%),
    #F8DBB6;
  overflow: hidden;
}

/* ---------- Prime Minister row ---------- */
.ldr__pm {
  grid-column: 2 / 5;
  grid-row: 1;
  display: grid;
  grid-template-columns: minmax(0, 42fr) minmax(0, 38fr);
  gap: 4vw;
  align-items: start;
  margin-right: -8.5vw;
}

.ldr__pm-text {
  margin: 0;
  padding-top: .2vw;
}

.ldr__pm-quote {
  margin: 0;
}

.ldr__pm-quote p {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(1.4rem, 2.3vw, 3rem);
  line-height: 1.17;
  letter-spacing: -.03em;
  color: var(--ldr-ink);
}

.ldr__pm-photo {
  overflow: hidden;
  margin-top: -.8vw;
  border-radius: clamp(8px, .7vw, 14px);
  /* background: #fff; */
}

/* whole photo at its natural ratio: never stretched or cropped */
.iaadb-layout__main .ldr__pm-photo img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  filter: none;
  outline: 0;
}

/* ---------- Quote marks ---------- */
.ldr__q {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--ldr-quote);
  line-height: 0;
}

.ldr__q--open {
  display: block;
  height: .5em;
  margin-bottom: .1em;
  font-size: 1.25em;
  line-height: 1;
}

.ldr__q--close {
  display: inline-block;
  margin-left: .25em;
  font-size: 1.25em;
  transform: translateY(.42em);
}

/* ---------- Byline ---------- */
.ldr__by {
  display: flex;
  flex-direction: column;
  gap: .2em;
  margin-top: clamp(14px, 1.7vw, 36px);
}

.ldr__name {
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(1rem, 1.56vw, 2rem);
  line-height: 1.2;
  letter-spacing: -.03em;
  color: var(--ldr-ink);
}

.ldr__role {
  font-family: var(--font-ui);
  font-size: clamp(.72rem, .78vw, 1rem);
  color: var(--ldr-soft);
}

/* ---------- Minister / Secretary cards ---------- */
.ldr__card {
  grid-row: 2;
  align-self: start;
}

.ldr__card--left {
  grid-column: 2 / 3;
  margin-top: 5.2vw;
}

.ldr__card--right {
  grid-column: 4 / 5;
  margin-top: 15.8vw;
}

.iaadb-layout__main .ldr__photo {
  display: block;
  width: 74%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: clamp(6px, .45vw, 10px);
  filter: none;
  outline: 0;
}

.ldr__card--right .ldr__photo {
  width: 70%;
}

.ldr__text {
  margin: clamp(20px, 2.6vw, 54px) 0 0;
}

.ldr__quote {
  margin: 0;
}

.ldr__quote p {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(.86rem, .98vw, 1.3rem);
  line-height: 1.6;
  color: var(--ldr-ink);
  font-style : italic;
}

.ldr__quote .ldr__q--open {
  font-size: 2.6em;
  height: .32em;
  margin-bottom: .45em;
}

.ldr__quote .ldr__q--close {
  display: block;
  width: fit-content;
  margin: .2em 22% 0 auto;
  font-size: 2.6em;
  transform: none;
  line-height: .55;
}

.ldr__card .ldr__by {
  margin-top: clamp(12px, 1.6vw, 32px);
}

.ldr__card .ldr__name {
  font-size: clamp(.86rem, .9vw, 1.15rem);
}

.ldr__card .ldr__role {
  font-size: clamp(.7rem, .7vw, .9rem);
}

/* ============== Tablet + mobile: single column ============== */
@media (max-width: 899px) {
  .ldr {
    display: flex;
    flex-direction: column;
    gap: 64px;
    padding: 72px var(--gutter);
  }

  .ldr__pm {
    grid-template-columns: 1fr;
    gap: 32px;
    margin: 0;
  }

  .ldr__pm-quote p {
    font-size: clamp(1.5rem, 4.2vw, 2.1rem);
  }

  .ldr__pm-photo {
    margin-top: 0;
    max-width: 560px;
  }

  .ldr__card--left,
  .ldr__card--right {
    margin-top: 0;
    display: grid;
    grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
    gap: 32px;
    align-items: start;
  }

  .iaadb-layout__main .ldr__photo,
  .ldr__card--right .ldr__photo {
    width: 100%;
  }

  .ldr__text {
    margin-top: 0;
  }

  .ldr__quote p {
    font-size: 1rem;
  }

  .ldr__name,
  .ldr__card .ldr__name {
    font-size: 1.1rem;
  }

  .ldr__role,
  .ldr__card .ldr__role {
    font-size: .82rem;
  }
}

@media (max-width: 599px) {
  .ldr {
    gap: 56px;
    padding: 56px var(--gutter);
  }

  .ldr__card--left,
  .ldr__card--right {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .iaadb-layout__main .ldr__photo,
  .ldr__card--right .ldr__photo {
    width: min(72%, 260px);
  }
}

/* --- home-social-fix.css --- */
/* Posts show whole at their natural ratio on every screen: no stretch, no crop */
.social-media__header {
  gap: 24px;
}

.social-media__title {
   font-size: clamp(2.4rem, 4vw, 3.5rem);
  overflow-wrap: break-word;
}

.social-media__slider {
  align-items: flex-start;
  padding-top: 8px; /* room for the hover lift */
}

.sm-slide {
  display: block;
  height: auto;
  transition: transform .5s var(--ease);
}

.iaadb-layout__main .sm-slide__img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: fill !important;
  transform: none;
}

/* lift the card instead of zooming the image (zoom clipped the edges) */
.sm-slide:hover .sm-slide__img {
  transform: none;
}

.sm-slide:hover {
  transform: translateY(-6px);
}

@media (prefers-reduced-motion: reduce) {
  .sm-slide,
  .sm-slide:hover {
    transition: none;
    transform: none;
  }
}

/* Equal height for every post: height is fixed per breakpoint and width follows
   each image's own ratio (posts are 0.75–0.80 wide), so nothing is cropped or stretched */
.social-media__slider-container {
  container-type: inline-size;
  --sm-cols: 6;
}

.sm-slide {
  flex: 0 0 auto;
  height: calc((100cqi - (var(--sm-cols) - 1) * 20px) / var(--sm-cols) / .78);
}

.iaadb-layout__main .sm-slide__img {
  width: auto;
  height: 100%;
  max-width: none;
}

@media (max-width: 1200px) {
  .social-media__slider-container { --sm-cols: 5; }
  .sm-slide { flex: 0 0 auto; }
}

@media (max-width: 900px) {
  .social-media__slider-container { --sm-cols: 4; }
  .sm-slide { flex: 0 0 auto; }
}

@media (max-width: 768px) {
  .social-media__slider-container { --sm-cols: 3; }
  .sm-slide { flex: 0 0 auto; }
}

@media (max-width: 500px) {
  .social-media__slider-container { --sm-cols: 2; }
  .sm-slide { flex: 0 0 auto; }
}

/* Space before the leadership section: the collage overhangs the panel by
   ~11vw, so give the banner enough bottom room to show it whole, plus a gap */
@media (min-width: 900px) {
  .cal {
    padding-bottom: 12vw;
  }
}


/* --- object-fit overrides --- */
/* A global rule forces `object-fit: fill !important` on every image in <main>,
   which stretches any image whose box doesn't match its ratio. Restore the
   intended fit where boxes have a fixed shape. */
.iaadb-layout__main .vcard__img {
  object-fit: cover !important;
  filter: none !important;
  outline: 0 !important;
  border-radius: 10px 10px 0 0;
}

.iaadb-layout__main .exh .exh-card__media img,
.iaadb-layout__main .exd .exd-cover img,
.iaadb-layout__main .exd .exd-album img {
  object-fit: cover !important;
}

/* Hero: a little more room under the header on desktop */
@media (min-width: 1024px) {
  .hero {
    padding-top: clamp(36px, 5.5vh, 72px);
  }
}

/* --- Hero on phones: dates top-left above the title, two full-width buttons --- */
.hero__cta {
  display: none;
}

@media (max-width: 767px) {
  .hero .hero__grid {
    display: flex;
    flex-direction: column;
  }

  .hero .hero__grid .hero__dates {
    order: -1;
    align-self: flex-start;
    margin: 0 0 clamp(10px, 3vw, 18px);
    text-align: left;
  }

  .hero .hero__cta {
    display: flex;
    margin-top: clamp(20px, 6vw, 40px);
    padding-inline: var(--gutter);
  }

  /* dates moved above the title, so the stepwell no longer tucks up beside them */
  .hero .hero__art--l {
    margin-top: clamp(6px, 2vw, 14px);
  }

  .hero .hero__cta .btn-pass,
  .hero .hero__cta .btn-outline {
    border-radius: 10px;
    min-height: 52px;
    font-size: 1rem;
    font-weight: 500;
  }

  .hero .hero__cta .btn-outline {
    border: 1px solid var(--pink);
    background: transparent;
    color: var(--ink);
  }

  .hero .hero__cta .btn-outline::before {
    display: none;
  }
}

/* Tat Tvam Asi on tablet/mobile: the lettering image is taller than the old text
   heading, so the statue no longer tucks up under it; it starts below with a gap */
@media (max-width: 1023px) {
  .tta .tta__art {
    margin-top: 0;
  }
}

@media (max-width: 639px) {
  .tta .tta__art {
    margin-top: 0;
  }
}

/* --- venues + dynamic pages --- */
/* =====================================================================
   JSON-driven pages: venues.html, venue-detail.html, and the dynamic
   exhibition listing/detail. Sizes from the 1920px references (vw).
   ===================================================================== */

/* Hold the footer down while content loads */
#vnl:empty,
#vnd:empty,
#exd-root:empty,
#exh-sections:empty {
  min-height: 70vh;
}

/* ---------- Whole-image frame: no crop, no stretch ---------- */
.fitimg {
  position: relative;
  display: block;
  overflow: hidden;
  background: #efe6d8;
  isolation: isolate;
}

.fitimg::before {
  content: "";
  position: absolute;
  inset: -16px;
  z-index: -1;
  background: var(--fit-bg) center / cover no-repeat;
  filter: blur(18px) saturate(1.05);
  opacity: .55;
}

.iaadb-layout__main .fitimg img,
.iaadb-layout__main .exh .exh-card__media.fitimg img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover !important;
}

/* ================= Venue listing ================= */
.vnl {
  padding: clamp(36px, 4vw, 80px) var(--gutter) clamp(64px, 6vw, 120px);
  background: var(--bg);
  color: var(--ink);
}

.vnl__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px 48px;
  margin-bottom: clamp(28px, 2.6vw, 52px);
}

.vnl__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(2.6rem, 7.1vw, 9.4rem);
  line-height: 1;
  letter-spacing: -.035em;
}

.vnl__pass {
  max-width: min(27vw, 520px);
  padding-top: .6vw;
  text-align: right;
  font-family: var(--font-ui);
  font-size: clamp(.78rem, .8vw, 1rem);
  line-height: 1.35;
  color: var(--ink-soft);
}

.vnl__pass p {
  margin: 0;
}

.vnl__pass p + p {
  margin-top: .9em;
}

.vnl__pass .vnl__pass-heading {
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--ink);
}

.vnl__pass .vnl__pass-heading + p {
  margin-top: .15em;
}

.vnl__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(24px, 2.3vw, 44px) clamp(14px, 1.5vw, 30px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.vcd[hidden] {
  display: none;
}

.vcd__link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.vcd__media {
  aspect-ratio: 192 / 206;
  border-radius: 2px;
}

.vcd__media img {
  transition: transform .8s var(--ease);
}

.vcd__link:hover .vcd__media img,
.vcd__link:focus-visible .vcd__media img {
  transform: scale(1.03);
}

.vcd__name {
  display: block;
  margin-top: clamp(8px, .8vw, 16px);
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(.95rem, 1.1vw, 1.4rem);
  line-height: 1.25;
  letter-spacing: -.01em;
}

.vcd__link:hover .vcd__name {
  color: var(--accent);
}

.vcd__link:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 4px;
}

/* Featured venue spans three columns, text over the sky */
.vcd--featured {
  grid-column: span 3;
}

.vnl__grid .vcd--featured + .vcd .vcd__media {
  aspect-ratio: 192 / 225;
}

.vcd--featured .vcd__link {
  position: relative;
  height: 100%;
  min-height: clamp(300px, 27.4vw, 640px);
  overflow: hidden;
  border-radius: 2px;
  background: #d9dfe4;
}

.iaadb-layout__main .vcd__hero {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover !important;
  object-position: center bottom;
  transition: transform 1s var(--ease);
}

.vcd--featured .vcd__link:hover .vcd__hero {
  transform: scale(1.02);
}

.vcd__overlay {
  position: relative;
  display: block;
  max-width: 44%;
  padding: clamp(24px, 2.9vw, 60px);
}

.vcd--featured .vcd__link::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(100deg, rgba(232, 238, 243, .7) 0%, rgba(232, 238, 243, .35) 38%, transparent 60%);
  pointer-events: none;
}

.vcd--featured .vcd__overlay {
  z-index: 1;
}

.vcd--featured .vcd__name {
  margin: 0;
  font-size: clamp(1.8rem, 3.3vw, 4.4rem);
  line-height: 1.05;
  letter-spacing: -.03em;
  color: #1a0a10;
}

.vcd--featured .vcd__link:hover .vcd__name {
  color: #1a0a10;
}

.vcd__desc {
  display: block;
  margin-top: clamp(10px, 1vw, 22px);
  font-family: var(--font-ui);
  font-size: clamp(.8rem, .82vw, 1.05rem);
  line-height: 1.5;
  color: #2b211a;
}

.vnl__more {
  display: flex;
  justify-content: center;
  margin-top: clamp(32px, 3vw, 60px);
}

/* ================= Venue detail ================= */
.vnd {
  padding-bottom: 0;
}

.vnd-hero {
  padding: clamp(32px, 3.4vw, 72px) var(--gutter) 0;
  text-align: center;
}

.vnd-hero__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(2.8rem, 7.4vw, 10rem);
  line-height: 1.02;
  letter-spacing: -.035em;
}

.vnd-hero__loc {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: clamp(8px, .8vw, 16px) 0 0;
  font-family: var(--font-ui);
  font-size: clamp(.86rem, .85vw, 1.05rem);
  color: var(--ink-soft);
}

.vnd-hero__loc svg {
  color: var(--accent);
}

.vnd-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(10px, .8vw, 16px);
  margin: clamp(24px, 2.4vw, 48px) 0 0;
  padding: 0;
  list-style: none;
}

.vnd-tab {
  display: inline-flex;
  align-items: center;
  gap: clamp(8px, .7vw, 14px);
  min-height: clamp(52px, 3.6vw, 72px);
  padding: 6px clamp(16px, 1.3vw, 26px) 6px clamp(12px, 1vw, 20px);
  border: 1px solid rgba(26, 10, 16, .1);
  border-radius: 999px;
  background: transparent;
  color: var(--ink);
  font: inherit;
  cursor: pointer;
  transition: background-color .3s, border-color .3s;
}

button.vnd-tab:hover {
  border-color: rgba(26, 10, 16, .25);
}

.vnd-tab.is-active {
  border-color: transparent;
  background: #EFE3CB;
}

.vnd-tab.is-soon {
  cursor: default;
  color: rgba(26, 10, 16, .42);
}

.vnd-tab__icon {
  display: block;
  width: auto;
  height: clamp(28px, 2.2vw, 44px);
}

.vnd-tab.is-soon .vnd-tab__icon {
  opacity: .5;
  filter: grayscale(1);
}

.vnd-tab__label {
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1rem, 1.15vw, 1.45rem);
  letter-spacing: -.01em;
  white-space: nowrap;
}

.vnd-tab__count {
  display: grid;
  place-items: center;
  min-width: 2.2em;
  height: 2.2em;
  padding: 0 .5em;
  border-radius: 999px;
  background: #4C3A2C;
  color: #fff;
  font-family: var(--font-ui);
  font-size: clamp(.68rem, .62vw, .82rem);
  font-weight: 600;
}

.vnd-tab__soon {
  padding: .35em .8em;
  border-radius: 999px;
  background: rgba(26, 10, 16, .08);
  color: rgba(26, 10, 16, .55);
  font-family: var(--font-ui);
  font-size: clamp(.6rem, .52vw, .72rem);
  white-space: nowrap;
}

[data-theme="dark"] .vnd-tab.is-active {
  background: #2c2117;
}

[data-theme="dark"] .vnd-tab.is-soon,
[data-theme="dark"] .vnd-tab__soon {
  color: rgba(255, 241, 220, .45);
}

.vnd-sec {
  padding: clamp(56px, 5.6vw, 110px) var(--gutter) 0;
  padding-bottom : 50px;
}

.vnd-sec__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(2.2rem, 4.6vw, 6rem);
  line-height: 1;
  letter-spacing: -.03em;
}

.vnd-empty {
  margin: 0;
  padding: clamp(32px, 3vw, 56px);
  border: 1px dashed var(--line);
  border-radius: 12px;
  font-family: var(--font-ui);
  color: var(--ink-soft);
  text-align: center;
}

.vnd-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 1.5vw, 30px);
  margin: clamp(24px, 2.4vw, 44px) 0 0;
  padding: 0;
  list-style: none;
}

.vnd-gallery__img {
  aspect-ratio: 4 / 3;
  border-radius: 8px;
}

.vnd-gallery p {
  margin: 8px 0 0;
  font-family: var(--font-ui);
  font-size: .9rem;
  color: var(--ink-soft);
}

.vnd-about {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: clamp(32px, 4vw, 90px);
  align-items: start;
  margin-top: clamp(64px, 6vw, 120px);
  padding: clamp(48px, 4.4vw, 90px) var(--gutter);
  background: var(--tint);
  display : none;
}

.vnd-about__desc {
  max-width: 52ch;
  margin: clamp(16px, 1.4vw, 28px) 0 0;
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.05vw, 1.3rem);
  line-height: 1.65;
  color: var(--ink-soft);
}

.vnd-info {
  display: grid;
  gap: 14px;
  margin: clamp(24px, 2.2vw, 40px) 0 0;
}

.vnd-info div {
  display: grid;
  grid-template-columns: minmax(110px, 30%) 1fr;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
  font-family: var(--font-ui);
  font-size: clamp(.9rem, .9vw, 1.1rem);
}

.vnd-info dt {
  font-weight: 600;
  color: var(--ink);
}

.vnd-info dd {
  margin: 0;
  color: var(--ink-soft);
}

.vnd-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: clamp(24px, 2.2vw, 40px);
}

.vnd-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  padding: 0 28px;
  border: 1px solid rgba(26, 10, 16, .45);
  border-radius: 10px;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: 1rem;
  text-decoration: none;
  transition: background-color .3s, color .3s, border-color .3s;
}

.vnd-btn:hover,
.vnd-btn:focus-visible {
  border-color: var(--pink);
  background: var(--pink);
  color: #fff;
}

.vnd-btn--pink {
  border-color: var(--pink);
  background: var(--pink);
  color: #fff;
}

.vnd-btn--pink:hover,
.vnd-btn--pink:focus-visible {
  border-color: var(--maroon);
  background: var(--maroon);
}

.vnd-map {
  overflow: hidden;
  aspect-ratio: 4 / 3;
  border-radius: 14px;
  box-shadow: 0 18px 40px -24px rgba(60, 20, 10, .35);
  background: #e9e4dc;
}

.vnd-map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

.vnd-back {
  margin: 0;
  padding: clamp(28px, 2.6vw, 48px) var(--gutter) clamp(48px, 4vw, 80px);
  font-family: var(--font-ui);
  display : none;
}

.vnd-back a {
  color: var(--ink-soft);
  text-decoration: none;
}

.vnd-back a:hover {
  color: var(--accent);
}

/* ================= Exhibition detail additions ================= */
.exd-cover--fit {
  aspect-ratio: 1920 / 1000;
}

.exd-cover__fit {
  width: 100%;
  height: 100%;
}

.exd-info__venue {
  color: inherit;
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0 100%;
  background-size: 0 1px;
  background-repeat: no-repeat;
  transition: background-size .4s var(--ease);
}

.exd-info__venue:hover {
  background-size: 100% 1px;
}

a.exd-info__reach {
  text-decoration: none;
}

.exd-related {
  padding: clamp(56px, 5.6vw, 110px) var(--gutter) clamp(64px, 6vw, 120px);
}

.exd-related__all {
  margin-bottom: 4px;
  font-family: var(--font-ui);
  color: var(--accent);
  text-decoration: none;
  white-space: nowrap;
}

/* ---------- Missing / error state ---------- */
.dyn-missing {
  display: grid;
  justify-items: center;
  gap: 16px;
  min-height: 60vh;
  align-content: center;
  padding: 64px var(--gutter);
  text-align: center;
  font-family: var(--font-ui);
}

.dyn-missing h1 {
  margin: 0;
  font-weight: 300;
  font-size: clamp(2rem, 4vw, 4rem);
}

.dyn-missing p {
  margin: 0;
  color: var(--ink-soft);
}

/* ================= Tablet ================= */
@media (max-width: 1023px) {
  .vnl__head {
    flex-direction: column;
  }

  .vnl__pass {
    max-width: 560px;
    text-align: left;
  }

  .vnl__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .vnl__grid .vcd--featured + .vcd .vcd__media {
    aspect-ratio: 192 / 206;
  }

  .vcd--featured {
    grid-column: 1 / -1;
  }

  .vcd--featured .vcd__link {
    min-height: clamp(300px, 46vw, 460px);
  }

  .vcd__overlay {
    max-width: 62%;
  }

  .vnd-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .vnd-about {
    grid-template-columns: 1fr;
  }
}

/* ================= Mobile ================= */
@media (max-width: 767px) {
  .vnl__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 14px;
  }

  .vcd--featured .vcd__link {
    display: flex;
    flex-direction: column;
    min-height: 0;
    background: transparent;
  }

  /* Phones: photo on top, text below (no text over the image) */
  .vcd--featured .vcd__link::before {
    display: none;
  }

  .iaadb-layout__main .vcd__hero {
    position: relative;
    inset: auto;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 2px;
  }

  .vcd__overlay {
    max-width: none;
    padding: 14px 0 0;
  }

  .vcd--featured .vcd__name,
  .vcd--featured .vcd__link:hover .vcd__name {
    font-size: clamp(1.6rem, 7vw, 2.2rem);
    color: var(--ink);
  }

  .vcd__desc {
    color: var(--ink-soft);
    font-size: .92rem;
  }

  .vnd-tab {
    min-height: 48px;
    padding: 4px 14px 4px 10px;
  }

  .vnd-tab__icon {
    height: 26px;
  }

  .vnd-tab__label {
    font-size: .95rem;
  }

  .vnd-info div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .vnd-cta .vnd-btn {
    flex: 1 1 100%;
  }
}

@media (prefers-reduced-motion: reduce) {

  .vcd__media img,
  .iaadb-layout__main .vcd__hero,
  .vnd-tab {
    transition: none;
  }
}

/* Venue cards: the venue photos are wide landscapes and the reference uses near-square
   frames, so they fill the frame (centred crop, never stretched) like the reference */
.vcd__media::before {
  display: none;
}

.iaadb-layout__main .vcd__media img {
  object-fit: cover !important;
  object-position: center;
}

/* Featured: show more sky so the overlay text sits on sky, as in the reference */
.iaadb-layout__main .vcd__hero {
  object-position: center 30%;
}

@media (min-width: 768px) {
  .vcd__overlay {
    max-width: 40%;
  }
}

/* Exhibition detail without write-up: the details run as one row instead of leaving an empty column */
.exd-body--info-only {
  grid-template-columns: 1fr;
}

.exd-body--info-only .exd-body__main {
  display: none;
}

.exd-body--info-only .exd-info {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 32px 40px;
  padding-top: 0;
  border-top: 0;
}

.exd-body--info-only .exd-info__item + .exd-info__item,
.exd-body--info-only .exd-info__item--share {
  margin-top: 0 !important;
}

/* Exhibitions without a dedicated cover use their card image: show it whole */
.iaadb-layout__main .exd .exd-cover--fit .fitimg img {
  object-fit: contain !important;
}

/* --- exhibition detail (full template) --- */
.exd2-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: clamp(10px, .9vw, 18px);
  color: rgba(255, 255, 255, .88);
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(.82rem, .82vw, 1.05rem);
  text-decoration: none;
}

.exd2-back:hover,
.exd2-back:focus-visible {
  color: #fff;
}

.exd2 .exd-hero__by {
  display: none;
}

.exd2 .exd-hero__title {
  max-width: 12ch;
}

.exd2-subtitle {
  margin: clamp(10px, 1vw, 20px) 0 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(1rem, 1.15vw, 1.5rem);
  color: rgba(255, 255, 255, .9);
}

/* Cover: whole image, full width, height capped; blurred copy fills any side space */
.exd2-cover {
  margin: 0;
}

.exd2-cover__fit {
  width: 100%;
  max-height: min(88vh, 1000px);
}

.iaadb-layout__main .exd2-cover__fit img {
  width: 100%;
  height: auto;
  max-height: min(88vh, 1000px);
  object-fit: cover !important;
}

.exd2-label {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(1.15rem, 1.1vw, 1.5rem);
  letter-spacing: -.03em;
  color: var(--ink);
}

.exd2-people {
  display: flex;
  flex-wrap: wrap;
  gap: 24px clamp(40px, 4vw, 90px);
  margin-bottom: clamp(36px, 3.4vw, 64px);
}

.exd2-people__list {
  margin: 8px 0 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.05rem, 1.05vw, 1.35rem);
  line-height: 1.3;
}

.exd2-people__list span {
  display: block;
  font-size: .78em;
  color: var(--ink-soft);
}

.exd2-people__none {
  margin: 8px 0 0;
  font-family: var(--font-ui);
}

.exd2-overview {
  max-width: 46ch;
  margin: 0 0 clamp(36px, 3.4vw, 64px);
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.15rem, 1.3vw, 1.7rem);
  line-height: 1.45;
  letter-spacing: -.01em;
}

.exd2 .exd-block p {
  font-size: clamp(.9rem, .85vw, 1.1rem);
}

.exd2 .exd-block p + p {
  margin-top: 1.2em;
}

.exd2 .exd-block + .exd-block {
  margin-top: clamp(40px, 4vw, 80px);
}

.exd2 .exd-info__item + .exd-info__item {
  margin-top: clamp(32px, 3vw, 60px);
}

.exd2 .exd-info__value {
  font-size: clamp(1.05rem, 1.15vw, 1.5rem);
}

.exd2-admission {
  max-width: 22ch;
}

/* Album on black: whole images in equal tiles */
.exd2-album__img {
  aspect-ratio: 405 / 502;
  background: #141414;
}

.exd2-album__img::before {
  opacity: .35;
}
.socialicon-img{
  height : 27px;
}
.exd-album figcaption{
  display : none;
}
/* .iaadb-layout__main .exd2 .exd-album .fitimg img {
  object-fit: contain !important;
} */

@media (max-width: 639px) {
  .iaadb-layout__main .exd2-cover__fit img {
    max-height: 70vh;
  }
}

@media (min-width: 1024px) {
  .exd2 .exd-hero {
    grid-template-columns: minmax(0, 1fr) minmax(0, 40%);
  }
}

/* --- Home venues: "Get Pass" revealed on hover --- */
.venue__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background: linear-gradient(180deg, transparent 45%, rgba(26, 10, 16, .55) 100%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .6s cubic-bezier(.16, 1, .3, 1);
}

.venue__pass {
  position: absolute;
  left: 50%;
  bottom: 28px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding: 0 22px 0 18px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .35);
  border-radius: 999px;
  background: var(--pink);
  color: #fff;
  font-family: var(--font-ui);
  font-size: .92rem;
  font-weight: 600;
  letter-spacing: .02em;
  white-space: nowrap;
  text-decoration: none;
  box-shadow: 0 14px 30px -12px rgba(250, 32, 127, .7);
  transform: translateX(-50%);
  transition: background-color .3s, box-shadow .4s, transform .5s cubic-bezier(.16, 1, .3, 1);
}

/* light sweep across the pill on hover */
.venue__pass::before {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .45), transparent);
  transform: skewX(-20deg);
  pointer-events: none;
}

.venue__pass-arrow {
  transition: transform .4s cubic-bezier(.16, 1, .3, 1);
}

.venue__pass:hover,
.venue__pass:focus-visible {
  background: var(--maroon);
  box-shadow: 0 18px 36px -14px rgba(115, 12, 57, .8);
}

.venue__pass:hover::before {
  animation: venue-shine .9s ease;
}

.venue__pass:hover .venue__pass-arrow,
.venue__pass:focus-visible .venue__pass-arrow {
  transform: translateX(4px);
}

.venue__pass:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

@keyframes venue-shine {
  to {
    left: 120%;
  }
}

/* Hover devices: hidden until the card is hovered or focused, then rises in */
@media (hover: hover) {
  .venue__pass {
    opacity: 0;
    transform: translate(-50%, 18px) scale(.94);
    transition: opacity .45s ease, background-color .3s, box-shadow .4s, transform .6s cubic-bezier(.16, 1, .3, 1);
  }

  .venue__pass-icon,
  .venue__pass span:not(.sr-only),
  .venue__pass-arrow {
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .4s ease .12s, transform .5s cubic-bezier(.16, 1, .3, 1) .12s;
  }

  .venue:hover .venue__scrim,
  .venue:focus-within .venue__scrim {
    opacity: 1;
  }

  .venue:hover .venue__pass,
  .venue:focus-within .venue__pass {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
  }

  .venue:hover .venue__pass-icon,
  .venue:hover .venue__pass span,
  .venue:hover .venue__pass-arrow,
  .venue:focus-within .venue__pass-icon,
  .venue:focus-within .venue__pass span,
  .venue:focus-within .venue__pass-arrow {
    opacity: 1;
    transform: none;
  }

  .venue .venue__pass:hover .venue__pass-arrow {
    transform: translateX(4px);
  }
}

/* Touch devices: always visible, slightly smaller */
@media (hover: none) {
  .venue__scrim {
    opacity: .8;
  }

  .venue__pass {
    bottom: 16px;
    min-height: 42px;
    padding: 0 18px 0 14px;
    font-size: .85rem;
  }
}

@media (prefers-reduced-motion: reduce) {

  .venue__pass,
  .venue__pass-icon,
  .venue__pass span,
  .venue__pass-arrow,
  .venue__scrim {
    transition: opacity .2s ease !important;
  }

  .venue__pass:hover::before {
    animation: none;
  }
}

/* Phones: "Get Pass" sits under the photo as its own full-width button (desktop hover unchanged) */
@media (max-width: 767px) {
  .venues .venue {
    display: flex;
    flex-direction: column;
  }

  /* the wrap's children (photo, button) join the card's column */
  .venues .venue .venue__img-wrap {
    display: contents;
  }

  .venues .venue .venue__img-wrap::before,
  .venues .venue .venue__img-wrap::after,
  .venues .venue .venue__scrim {
    display: none;
  }

  .venues .venue .venue__img-wrap .venue__img {
    border-radius: 12px;
  }

  .venues .venue .venue__pass,
  .venues .venue:hover .venue__pass,
  .venues .venue:focus-within .venue__pass {
    position: static;
    order: 2;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    margin-top: 10px;
    padding: 0 12px;
    border: 0;
    border-radius: 10px;
    font-size: .88rem;
    opacity: 1;
    transform: none;
    box-shadow: 0 8px 18px -12px rgba(250, 32, 127, .7);
  }

  .venues .venue .venue__pass * {
    opacity: 1 !important;
    transform: none !important;
  }

  .venues .venue .venue__info {
    order: 3;
    margin-top: 12px;
  }
}

/* Phones: "Get Pass" as plain underlined text under the photo */
@media (max-width: 767px) {
  .venues .venue .venue__pass,
  .venues .venue:hover .venue__pass,
  .venues .venue:focus-within .venue__pass,
  .venues .venue .venue__pass:hover,
  .venues .venue .venue__pass:focus-visible {
    align-self: flex-start;
    justify-content: flex-start;
    width: auto;
    min-height: 0;
    margin-top: 12px;
    padding: 0;
    border-radius: 0;
    background: none;
    color: var(--ink);
    box-shadow: none;
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
    text-decoration: underline;
    text-underline-offset: 4px;
    display : none;
  }
  .vmap-left
  {
    display : none !important;
  }
  

  .venues .venue .venue__pass::before,
  .venues .venue .venue__pass-icon,
  .venues .venue .venue__pass-arrow {
    display: none;
  }

  .venues .venue .venue__info {
    margin-top: 8px;
  }
}

/* Menu overlay: gate drawing (header-bg.png) faintly on the right, bleeding off the edge */
.menu-art--gate {
  position: absolute;
  right: -6vw;
  bottom: -2vh;
  width: min(56vw, 1100px);
  height: auto;
  max-height: 92vh;
  object-fit: contain;
  object-position: right bottom;
  mix-blend-mode: multiply;
  opacity: .32;
  pointer-events: none;
}

@media (max-width: 767px) {
  .menu-art--gate {
    right: -18vw;
    width: 110vw;
    opacity: .22;
  }
}

/* Tat Tvam Asi on phones: centred stack — Devanagari, lettering, one intro paragraph,
   description, button, then the whole statue at the bottom. Desktop/tablet unchanged. */
.tta__mlead {
  display: none;
}

@media (max-width: 767px) {
  .tta {
    align-items: center;
    padding: 56px var(--gutter) 0;
    text-align: center;
  }

  .tta .tta__head {
    align-self: center;
    text-align: center;
  }

  .tta .tta__deva {
    font-size: clamp(1.6rem, 6.8vw, 2.1rem);
  }

  .tta .tta__title {
    margin-top: clamp(18px, 6vw, 30px);
  }

  .iaadb-layout__main .tta .tta__logo {
    /* image has ~11% transparent padding per side */
    width: clamp(170px, 46vw, 240px);
    margin: 0 auto;
  }

  /* the two intro sentences read as one paragraph here; the originals are hidden only
     when the combined paragraph exists, so the text never goes missing */
  .tta:has(.tta__mlead) .tta__lead,
  .tta:has(.tta__mlead) .tta__invite {
    display: none;
  }

  .tta .tta__lead,
  .tta .tta__invite {
    order: 2;
    max-width: 30ch;
    margin-inline: auto;
    text-align: center;
  }

  .tta__mlead {
    display: block;
    order: 2;
    max-width: 30ch;
    margin: clamp(28px, 9vw, 44px) auto 0;
    font-family: var(--font-ui);
    font-weight: 300;
    font-size: clamp(1.15rem, 4.6vw, 1.4rem);
    line-height: 1.25;
    letter-spacing: -.02em;
    color: var(--tta-ink);
  }

  .tta .tta__side {
    order: 3;
    max-width: 36ch;
    margin: 0 auto;
    text-align: center;
  }

  .tta .tta__desc {
    margin-top: clamp(18px, 5vw, 26px);
    font-size: clamp(.86rem, 3.4vw, .98rem);
    line-height: 1.5;
    color: var(--tta-ink);
  }

  .tta .tta__btn {
    margin-top: 24px;
  }

  /* statue last, full width, whole image */
  .tta .tta__art {
    order: 4;
    align-self: center;
    width: calc((100% + 2 * var(--gutter)) * 1.18);
    max-width: none;
    margin: clamp(16px, 6vw, 32px) 0 0;
    -webkit-mask-image: none;
    mask-image: none;
  }
}

/* Phones: "View Curatorial Statement" sits over the lower part of the statue */
@media (max-width: 767px) {
  .tta .tta__side {
    position: static;
  }

  .tta .tta__btn {
    position: absolute;
    left: 50%;
    bottom: clamp(48px, 15vw, 90px);
    z-index: 2;
    width: min(82%, 320px);
    height: auto;
    min-height: clamp(52px, 13vw, 64px);
    margin: 0;
    font-size: clamp(1rem, 4.2vw, 1.2rem);
    font-weight: 400;
    border-color: rgba(251, 228, 230, .85);
    transform: translateX(-50%);
  }
}

/* ===================== Phone layouts (max 767px) ===================== */
.exp-nav {
  display: none;
}

@media (max-width: 767px) {
  /* ---- Explore: swipe slider, centred card with neighbours peeking ---- */
  .explore-sec .exp-grid {
    display: flex;
    gap: 16px;
    margin-inline: calc(var(--gutter) * -1);
    padding: 0 7vw 4px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 15vw;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
  }

  .explore-sec .exp-grid::-webkit-scrollbar {
    display: none;
  }

  .explore-sec .exp-card {
    flex: 0 0 70vw;
    max-width: 340px;
    scroll-snap-align: center;
  }

  .exp-nav {
    display: flex;
    gap: 16px;
    margin-top: 28px;
  }

  .exp-nav__btn,
  .social-media__nav .sm-nav-btn {
    width: 54px;
    height: 54px;
  }

  /* ---- Calendar: centred title + dates, collage, button below ---- */
  .cal .cal__box {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 28px 18px 32px;
    text-align: center;
  }

  .cal .cal__text {
    display: contents;
  }

  .cal .cal__title {
    order: 1;
    font-size: clamp(1.3rem, 5vw, 1.6rem);
  }

  .cal .cal__dates {
    order: 2;
    margin-top: 10px;
    font-size: clamp(1.25rem, 5.6vw, 1.75rem);
    letter-spacing: -.03em;
  }

  .iaadb-layout__main .cal .cal__art {
    order: 3;
    width: min(100%, 420px);
    margin: 14px auto 0;
  }

  .cal .cal__btn {
    order: 4;
    width: min(70%, 240px);
    margin-top: 20px;
    font-size: 1.05rem;
  }

  /* ---- Leadership: photo + name side by side, quote below ---- */
  .ldr .ldr__pm,
  .ldr .ldr__card--left,
  .ldr .ldr__card--right {
    display: grid;
    grid-template-columns: minmax(0, 40%) minmax(0, 1fr);
    gap: 20px 18px;
    align-items: center;
  }

  .ldr .ldr__pm-text,
  .ldr .ldr__text {
    display: contents;
  }

  .ldr .ldr__pm-photo,
  .iaadb-layout__main .ldr .ldr__photo {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    margin: 0;
  }

  .ldr .ldr__by {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
  }

  .ldr .ldr__name,
  .ldr .ldr__card .ldr__name {
    font-weight: 400;
    font-size: clamp(1.15rem, 5vw, 1.45rem);
    line-height: 1.15;
  }

  .ldr .ldr__role,
  .ldr .ldr__card .ldr__role {
    margin-top: 6px;
    font-size: clamp(.86rem, 3.6vw, 1rem);
    color: var(--ldr-ink);
  }

  .ldr .ldr__pm-quote,
  .ldr .ldr__quote {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .ldr .ldr__pm-quote p,
  .ldr .ldr__quote p {
    font-weight: 300;
    font-style: italic;
    font-size: clamp(1.05rem, 4.4vw, 1.3rem);
    line-height: 1.6;
  }

  .ldr .ldr__q--open,
  .ldr .ldr__quote .ldr__q--open {
    height: auto;
    margin-bottom: .2em;
    font-size: 3.6rem;
    line-height: .8;
  }

  .ldr .ldr__q--close,
  .ldr .ldr__quote .ldr__q--close {
    display: block;
    width: fit-content;
    margin: .35em 0 0;
    font-size: 3.6rem;
    line-height: .6;
    transform: none;
  }

  /* ---- Social media: bigger posts (about 1.5 per screen) ---- */
  .social-media__slider-container {
    --sm-cols: 1.55;
  }

  .social-media__nav {
    justify-content: flex-start;
  }
}

/* Phones: PM block = big italic quote, name + title, then full-width photo */
@media (max-width: 767px) {
  .ldr .ldr__pm {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 24px;
  }

  .ldr .ldr__pm-text {
    display: block;
  }

  .ldr .ldr__pm .ldr__by {
    margin-top: 16px;
  }

  .ldr .ldr__pm-quote p {
    font-size: clamp(1.35rem, 5.6vw, 1.75rem);
    line-height: 1.22;
    letter-spacing: -.03em;
  }

  .ldr .ldr__pm .ldr__name {
    font-weight: 300;
    font-size: clamp(1.35rem, 5.8vw, 1.7rem);
  }

  .ldr .ldr__pm .ldr__role {
    font-size: clamp(.9rem, 3.6vw, 1rem);
  }

  .ldr .ldr__pm-photo {
    width: 100%;
    border-radius: 12px;
  }

  /* Venues Map: no heading on phones */
  .venues-map-section .vmap-title {
    display: none;
  }
}

/* Explore slider: start cards from the left edge (centring pushed them out of reach) */
@media (max-width: 767px) {
  .explore-sec .exp-grid {
    justify-content: flex-start;
  }
}

/* --- Exhibitions on phones: card-style filters + one-line section headings --- */
@media (max-width: 767px) {
  .exh-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 28px;
    border: 0;
  }

  .exh-filters .exh-filter,
  .exh-filters .exh-filter:nth-child(3) {
    min-height: 60px;
    padding: 10px 36px 10px 14px;
    border: 1px solid var(--exh-border);
    border-radius: 12px;
    background: rgba(255, 255, 255, .35);
    transition: border-color .3s, background-color .3s;
  }

  .exh-filters .exh-filter:focus-within {
    outline: none;
    border-color: var(--accent);
    background: rgba(255, 255, 255, .6);
  }

  /* Type spans the row; Date + Venue share the next */
  .exh-filters .exh-filter:first-child {
    grid-column: 1 / -1;
  }

  .exh-filters .exh-filter svg {
    right: 14px;
  }

  .exh-filter__label {
    font-size: .64rem;
  }

  .exh-filter select {
    margin-top: 3px;
    padding-right: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .95rem;
  }

  .exh-filters .exh-clear {
    grid-column: 1 / -1;
    justify-self: end;
    min-height: 36px;
    margin: 2px 0 0;
    padding: 0 2px;
    border: 0;
    font-size: .85rem;
    color: var(--ink-soft);
  }

  [data-theme="dark"] .exh-filters .exh-filter {
    background: rgba(255, 255, 255, .04);
  }

  /* heading + count on one line, heading never wraps */
  .exh-sec__head,
  .exh .exh-sec__head {
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 12px;
  }

  .exh-sec__title,
  .exh .vnd-sec__title {
    min-width: 0;
    font-size: clamp(1.15rem, 5.4vw, 2rem);
    white-space: nowrap;
    letter-spacing: -.03em;
  }

  .exh-sec__count {
    flex: 0 0 auto;
    margin: 0;
    font-size: clamp(.72rem, 3vw, .85rem);
  }
}

/* --- Exhibition detail on phones: details list first, album slider --- */
.exd-reach__short,
.exd-album__nav {
  display: none;
}

@media (max-width: 767px) {
  /* one column: details → about → share */
  .exd2 .exd-body {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .exd2 .exd-body__main,
  .exd2 .exd-info,
  .exd2 .exd2-people {
    display: contents;
  }

  .exd2 .exd2-people__col,
  .exd2 .exd-info__item {
    order: 1;
    margin: 0 !important;
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
  }

  .exd2 .exd2-people__col:first-child {
    padding-top: 0;
  }

  .exd2 .exd-info__item {
    order: 2;
  }

  .exd2 .exd2-overview,
  .exd2 .exd-block {
    order: 3;
  }

  .exd2 .exd-info__item:has(.exd-share) {
    order: 4;
    margin-top: 36px !important;
    padding-bottom: 0;
    border-bottom: 0;
  }

  .exd2 .exd2-overview {
    margin: 36px 0 0;
  }

  .exd2 .exd-block,
  .exd2 .exd-block + .exd-block {
    margin-top: 36px;
  }

  .exd2 .exd2-label,
  .exd2 .exd-info__label {
    font-size: 1.15rem;
    font-weight: 400;
  }

  .exd2 .exd2-people__list,
  .exd2 .exd2-people__none,
  .exd2 .exd-info__value {
    margin-top: 8px;
    font-size: 1.08rem;
    line-height: 1.45;
  }

  .exd2 .exd2-admission {
    max-width: none;
  }

  .exd2 .exd-info__value br {
    display: none;
  }

  /* Where: place on the left, "Directions →" on the right */
  .exd2 .exd-info__item:has(.exd-info__reach) {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: baseline;
    column-gap: 16px;
  }

  .exd2 .exd-info__item:has(.exd-info__reach) .exd-info__label {
    grid-column: 1 / -1;
  }

  .exd2 .exd-info__reach {
    margin: 0;
    font-size: .95rem;
    white-space: nowrap;
  }

  .exd-reach__long {
    display: none;
  }

  .exd-reach__short {
    display: inline;
  }

  /* Album: swipe slider, ~3/4 image with the next peeking, arrows below */
  .exd2 .exd-album__grid {
    display: flex;
    gap: 20px;
    margin-right: calc(var(--gutter) * -1);
    padding-right: var(--gutter);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .exd2 .exd-album__grid::-webkit-scrollbar {
    display: none;
  }

  .exd2 .exd-album__grid > li {
    flex: 0 0 76%;
    scroll-snap-align: start;
  }

  .exd2-album__img {
    aspect-ratio: 350 / 434;
  }

  .exd2 .exd-album figcaption {
    font-size: 1rem;
    color: #fff;
  }

  .exd-album__nav {
    display: flex;
    gap: 16px;
    margin-top: 28px;
  }

  .exd-album__btn {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: 50%;
    background: transparent;
    color: #fff;
    cursor: pointer;
    transition: background-color .3s, color .3s;
  }

  .exd-album__btn:hover,
  .exd-album__btn:focus-visible {
    background: #fff;
    color: #000;
  }
}

/* Venue detail on phones: tabs in one swipeable row, active tab centred */
@media (max-width: 767px) {
  .vnd .vnd-tabs {
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: 10px;
    margin-inline: calc(var(--gutter) * -1);
    padding: 4px var(--gutter) 8px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
    scroll-padding-inline: var(--gutter);
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .vnd .vnd-tabs::-webkit-scrollbar {
    display: none;
  }

  .vnd .vnd-tabs li {
    flex: 0 0 auto;
    scroll-snap-align: center;
  }

  .vnd .vnd-tab {
    min-height: 50px;
    padding: 4px 14px 4px 10px;
    white-space: nowrap;
  }

  .vnd .vnd-tab.is-active {
    box-shadow: inset 0 0 0 1px rgba(76, 58, 44, .18);
  }

  .vnd .vnd-tab__icon {
    height: 28px;
  }

  .vnd .vnd-tab__label {
    font-size: 1rem;
  }
}


/* Home Venues: centred heading (same font) with the Biennale Pass note below */
.venues .venues__title {
  padding-bottom: 0;
  text-align: center;
}

.venues__pass {
  max-width: 720px;
  margin: clamp(20px, 2vw, 32px) auto clamp(40px, 4.5vw, 64px);
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(.95rem, 1.05vw, 1.15rem);
  line-height: 1.45;
  text-align: center;
  color: var(--ink);
}

.venues__pass p {
  margin: 0;
}

.venues__pass .venues__pass-heading {
  margin-bottom: .35em;
  font-weight: 400;
  font-size: clamp(1.1rem, 1.35vw, 1.45rem);
  letter-spacing: .01em;
  text-transform: uppercase;
}

.venues__pass .venues__pass-text {
  margin-top: 1.8em;
}

.venues__pass em {
  margin-right: .1em;
  font-style: italic;
  color: var(--accent);
}

/* ===================== Site menu (reference design) ===================== */
.menu-overlay {
  --menu-bg: #C40E5D;
  background: var(--menu-bg);
}

/* eyebrow kept for screen readers only */
.menu-overlay .menu-overlay__eyebrow {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.menu-overlay .menu-overlay__top {
  justify-content: flex-end;
  padding: clamp(28px, 4.2vw, 64px) var(--gutter) 0;
}

/* small round close button */
.menu-overlay .menu-close {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  min-height: 0;
  padding: 0;
  border: 1px solid rgba(255, 247, 233, .7);
  border-radius: 50%;
  background: transparent;
  color: var(--cream);
  transition: background-color .35s var(--ease), color .35s var(--ease), transform .5s var(--ease);
}

.menu-overlay .menu-close > span {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.menu-overlay .menu-close svg {
  width: 14px;
  height: 14px;
}

.menu-overlay .menu-close:hover,
.menu-overlay .menu-close:focus-visible {
  background: var(--cream);
  color: var(--menu-bg);
  transform: rotate(90deg);
}

.menu-overlay .menu-close:hover svg {
  transform: none;
}

/* two columns: first six items, then the rest */
.menu-overlay .menu-overlay__nav {
  align-items: flex-start;
  padding: clamp(4px, 1vw, 16px) var(--gutter) clamp(32px, 5vh, 64px);
}

.menu-overlay .menu-list {
  display: grid;
  grid-template-rows: repeat(6, auto);
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  column-gap: clamp(64px, 9vw, 180px);
  row-gap: clamp(6px, 1.2vh, 14px);
  width: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

.menu-overlay .menu-list li {
  border: 0;
  padding-bottom: .12em;
}

.menu-overlay .menu-list a {
  display: inline-block;
  padding: 2px 0;
  color: var(--cream);
  transition: transform .5s var(--ease);
}

.menu-overlay .menu-list__t {
  display: inline-block;
  font-family: "Season Mix-TRIAL";
  font-weight: 300;
  font-size: clamp(1.7rem, min(2.4vw, 5vh), 2.6rem);
  line-height: 1.25;
  letter-spacing: -.02em;
  /* animated underline */
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1.5px;
  transition: transform .9s var(--ease), background-size .45s var(--ease);
}

.menu-overlay .menu-list a:hover,
.menu-overlay .menu-list a:focus-visible {
  padding-left: 0;
  transform: translateX(6px);
}

.menu-overlay .menu-list a:hover .menu-list__t,
.menu-overlay .menu-list a:focus-visible .menu-list__t,
.menu-overlay .menu-list a:active .menu-list__t {
  font-style: normal;
  background-size: 100% 1.5px;
}

/* no footer row (dates / pass) in the menu on any screen size */
.menu-overlay .menu-overlay__foot {
  display: none;
}

/* gate drawing sits a little lower-right, as in the reference */
.menu-overlay .menu-art--gate {
  opacity: .28;
}

/* ---------- Phones: one column, comfortable size ---------- */
@media (max-width: 599px) {
  .menu-overlay .menu-overlay__top {
    padding-top: 22px;
  }

  .menu-overlay .menu-list {
    grid-template-rows: none;
    grid-auto-flow: row;
    row-gap: 6px;
  }

  .menu-overlay .menu-list__t {
    font-size: clamp(1.6rem, min(7.4vw, 5.4vh), 2.1rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .menu-overlay .menu-list a,
  .menu-overlay .menu-list__t,
  .menu-overlay .menu-close {
    transition: none;
  }
}

/* close button floats top-right so the first menu row lines up with it */
.menu-overlay .menu-overlay__top {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
}

.menu-overlay .menu-overlay__nav {
  padding-top: clamp(28px, 4.2vw, 64px);
  padding-right: calc(var(--gutter) + 60px);
}

.menu-overlay {
  grid-template-rows: 1fr auto;
}

/* Menu: the current page's item is highlighted (bolder) and underlined */
.menu-overlay .menu-list a[aria-current="page"] .menu-list__t {
  font-weight: 500;
  background-size: 100% 2px;
}

/* --- Coming Soon + Privacy Policy pages --- */
.cs-page {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 18px;
  min-height: 62vh;
  padding: clamp(64px, 8vw, 140px) var(--gutter);
  text-align: center;
  background: var(--bg);
  color: var(--ink);
}

.cs-page__eyebrow {
  margin: 0;
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
}

.cs-page__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.8rem, 8vw, 8rem);
  line-height: 1;
  letter-spacing: -.02em;
}

.cs-page__text {
  max-width: 46ch;
  margin: 0;
  font-family: var(--font-ui);
  font-size: clamp(1rem, 1.1vw, 1.2rem);
  line-height: 1.6;
  color: var(--ink-soft);
}

.cs-page__cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: 12px;
}

.legal {
  max-width: 820px;
  margin: 0 auto;
  padding: clamp(48px, 6vw, 110px) var(--gutter) clamp(64px, 7vw, 130px);
  font-family: var(--font-ui);
  font-size: clamp(.98rem, 1vw, 1.1rem);
  line-height: 1.7;
  color: var(--ink-soft);
}

.legal__title {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.6rem, 6vw, 5.5rem);
  line-height: 1.05;
  letter-spacing: -.02em;
  color: var(--ink);
}

.legal__updated {
  margin: 12px 0 36px;
  font-size: .9rem;
  color: var(--accent);
}

.legal h2 {
  margin: 40px 0 10px;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(1.2rem, 1.4vw, 1.5rem);
  letter-spacing: -.01em;
  color: var(--ink);
}

.legal p,
.legal ul {
  margin: 0 0 14px;
}

.legal ul {
  padding-left: 1.2em;
}

.legal li + li {
  margin-top: 6px;
}

.legal strong {
  color: var(--ink);
  font-weight: 500;
}

.legal a {
  color: var(--accent);
}

.legal ul {
  list-style: disc;
}

.legal li::marker {
  color: var(--accent);
}

/* Privacy Policy (document content) */
.legal__eyebrow {
  margin: 0 0 10px;
  font-family: var(--font-ui);
  font-size: .85rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
}

.legal__toc {
  margin: clamp(28px, 3vw, 44px) 0 clamp(12px, 2vw, 24px);
  padding: 22px 24px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, .35);
}

[data-theme="dark"] .legal__toc {
  background: rgba(255, 255, 255, .04);
}

.legal__toc ol {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 32px;
  margin: 0;
  padding-left: 1.4em;
  list-style: decimal;
}

.legal__toc li::marker {
  color: var(--accent);
}

.legal__toc a {
  color: var(--ink);
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1px;
  transition: background-size .35s var(--ease), color .3s;
}

.legal__toc a:hover,
.legal__toc a:focus-visible {
  color: var(--accent);
  background-size: 100% 1px;
}

.legal__sec {
  padding-top: clamp(28px, 3vw, 44px);
  border-top: 1px solid var(--line);
  margin-top: clamp(28px, 3vw, 44px);
  scroll-margin-top: 140px;
}

.legal__sec h2 {
  margin-top: 0;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.6rem, 2.2vw, 2.3rem);
  line-height: 1.15;
  letter-spacing: -.01em;
}

.legal h3 {
  margin: 26px 0 8px;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(1.05rem, 1.15vw, 1.2rem);
  color: var(--ink);
}

@media (max-width: 639px) {
  .legal__toc ol {
    grid-template-columns: 1fr;
  }

  .legal__sec {
    scroll-margin-top: 90px;
  }
}

/* Privacy Policy: content left, sticky section nav right */
.legal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
  column-gap: clamp(40px, 5vw, 96px);
  max-width: 1180px;
}

.legal > * {
  grid-column: 1;
}

.legal > .legal__toc {
  grid-column: 2;
  grid-row: 1 / span 10;
  align-self: start;
  position: sticky;
  top: calc(var(--head-h, 122px) + 24px);
  margin: 0;
  padding: 22px 0 22px 22px;
  border: 0;
  border-left: 1px solid var(--line);
  border-radius: 0;
  background: none;
}

.legal__toc-title {
  margin: 0 0 14px;
  font-family: var(--font-ui);
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

.legal > .legal__toc ol {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 0;
  list-style: none;
  counter-reset: toc;
}

.legal > .legal__toc li {
  counter-increment: toc;
}

.legal > .legal__toc a {
  position: relative;
  display: flex;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background-image: none;
  color: var(--ink-soft);
  font-size: .95rem;
  line-height: 1.35;
  transition: background-color .3s var(--ease), color .3s var(--ease);
}

.legal > .legal__toc a::before {
  content: counter(toc) ".";
  flex: 0 0 auto;
  color: var(--accent);
}

/* active marker on the rail */
.legal > .legal__toc a::after {
  content: "";
  position: absolute;
  left: -23px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  border-radius: 2px;
  background: var(--accent);
  transform: scaleY(0);
  transition: transform .35s var(--ease);
}

.legal > .legal__toc a:hover,
.legal > .legal__toc a:focus-visible {
  color: var(--ink);
  background: rgba(196, 14, 93, .06);
}

.legal > .legal__toc a.is-active {
  color: var(--ink);
  font-weight: 500;
  background: rgba(196, 14, 93, .09);
}

.legal > .legal__toc a.is-active::after {
  transform: scaleY(1);
}

/* Tablet + phones: one column, nav as a box above the content (not sticky) */
@media (max-width: 899px) {
  .legal {
    grid-template-columns: 1fr;
  }

  .legal > .legal__toc {
    grid-column: 1;
    grid-row: auto;
    position: static;
    margin: 28px 0 8px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(255, 255, 255, .35);
  }

  .legal > .legal__toc a::after {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .legal > .legal__toc a,
  .legal > .legal__toc a::after {
    transition: none;
  }
}

/* Privacy Policy, tablet + phones: sticky, horizontally scrollable section pills under the header */
@media (max-width: 899px) {
  .legal > .legal__toc {
    position: sticky;
    top: calc(var(--bar-h) + var(--head-h));
    z-index: 5;
    margin: 20px calc(var(--gutter) * -1) 0;
    padding: 10px 0;
    border: 0;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: var(--bg);
    box-shadow: 0 8px 16px -14px rgba(26, 10, 16, .35);
  }

  .legal > .legal__toc .legal__toc-title {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .legal > .legal__toc ol {
    flex-direction: row;
    gap: 8px;
    padding: 0 var(--gutter);
    overflow-x: auto;
    scroll-behavior: smooth;
    scroll-padding-inline: var(--gutter);
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }

  .legal > .legal__toc ol::-webkit-scrollbar {
    display: none;
  }

  .legal > .legal__toc li {
    flex: 0 0 auto;
  }

  .legal > .legal__toc a {
    align-items: center;
    padding: 9px 16px;
    border: 1px solid var(--line);
    border-radius: 999px;
    font-size: .9rem;
    white-space: nowrap;
  }

  .legal > .legal__toc a.is-active {
    border-color: transparent;
    background: var(--accent);
    color: #fff;
  }

  .legal > .legal__toc a.is-active::before {
    color: rgba(255, 255, 255, .85);
  }

  /* sections land below header + pill bar */
  .legal__sec {
    scroll-margin-top: calc(var(--bar-h) + var(--head-h) + 76px);
  }
}

/* keep the pill row inside the screen: grid items may shrink below their content width */
@media (max-width: 899px) {
  .legal {
    grid-template-columns: minmax(0, 1fr);
  }

  .legal > * {
    min-width: 0;
  }
}

@media (max-width: 899px) {
  .legal > .legal__toc ol {
    align-items: center;
  }

  .legal > .legal__toc li {
    display: flex;
  }

  .legal > .legal__toc a {
    line-height: 1.2;
  }
}

@media (max-width: 899px) {
  .legal > .legal__toc li + li {
    margin-top: 0;
  }
}

/* Footer visitor counter */
.india-footer__visitors {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 22px 0 0;
  padding: 8px 14px;
  border: 1px solid rgba(255, 247, 233, .28);
  border-radius: 999px;
  font-family: var(--font-ui);
  font-size: .85rem;
  letter-spacing: .02em;
  color: rgba(255, 247, 233, .85);
}

.india-footer__visitors[hidden] {
  display: none;
}

.india-footer__visitors strong {
  font-weight: 600;
  color: #fff;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 767px) {
  .india-footer__visitors {
    margin-bottom: 28px;
  }
}

/* ===================== Hero — desktop only (min 1024px), from reference ===================== */
@media (min-width: 1024px) {
  .hero {
    --hw: clamp(4.2rem, min(9.1vw, 18vh), 16rem);
    justify-content: center;
    padding-top: clamp(16px, 2.5vh, 40px);
  }

  /* drawings: stepwell bottom-left, gate right and vertically centred with the title */
  .hero .hero__art--l {
    width: 27.5vw;
    max-width: none;
    max-height: none;
    bottom: 0;
  }

  .hero .hero__art--r {
    width: 27.6vw;
    max-width: none;
    max-height: none;
    bottom: auto;
    top: max(0px, calc(47% - 10.35vw));
  }

  /* one centred column: title, then tagline */
  .hero .hero__grid {
    grid-template-columns: auto;
    justify-content: center;
    row-gap: 0;
  }

  .hero .hero__grid .hero__title {
    grid-column: 1;
    grid-row: 1;
  }

  .hero .hero__word,
  .hero .hero__title .hero__row .hero__word {
    font-size: var(--hw);
  }

  /* staggered rows: "The" and "India" stepped in, "Biennale'26" full left */
  .hero .hero__title .hero__row:nth-child(1) .hero__word {
    padding-left: .74em;
  }

  .hero .hero__title .hero__row:nth-child(2) .hero__word {
    padding-left: 1.57em;
  }

  .hero .hero__title .hero__row:nth-child(3) .hero__word {
    padding-left: 0;
  }

  /* dates sit inside the title box, left of "India" */
  .hero .hero__grid .hero__dates {
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    align-self: start;
    z-index: 2;
    margin: calc(var(--hw) * 1.08) 0 0 calc(var(--hw) * .07);
    padding: 0;
    transform: none;
    font-size: calc(var(--hw) * .15);
    line-height: 1.2;
    white-space: nowrap;
  }

  .hero .hero__grid .hero__city {
    display: none;
  }

  /* "Art | Architecture | Design" */
  .hero .hero__grid .hero__tagline {
    grid-column: 1;
    grid-row: 2;
    margin-top: calc(var(--hw) * .2);
    font-size: calc(var(--hw) * .14);
    font-weight: 400;
    letter-spacing: -.005em;
    text-transform: none;
  }
}

/* Footer wordmark: only "Asi" in italics */
.india-footer__wordmark em {
  font-style: italic;
}

/* ===================== Exhibitions filters: custom dropdowns + active state ===================== */
.exh-dd {
  position: relative;
  cursor: pointer;
  transition: background-color .3s var(--ease), box-shadow .3s var(--ease);
}

.exh-dd__native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0 !important;
  opacity: 0;
  pointer-events: none;
}

.exh-dd__btn {
  display: block;
  width: 100%;
  margin-top: 4px;
  padding: 0 56px 0 0;
  border: 0;
  background: transparent;
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: clamp(.95rem, 1vw, 1.15rem);
  text-align: left;
  cursor: pointer;
}

/* the whole filter box is the click target */
.exh-dd__btn::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

.exh-dd__btn:focus-visible {
  outline: none;
}

.exh-dd:has(.exh-dd__btn:focus-visible) {
  box-shadow: inset 0 0 0 2px var(--accent);
}

.exh-dd__value {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.exh-dd .exh-dd__chev {
  transition: transform .35s var(--ease), color .3s;
}

.exh-dd.is-open .exh-dd__chev {
  transform: translateY(-50%) rotate(180deg);
}

/* per-filter clear (×) */
.exh-dd__clear {
  position: absolute;
  top: 50%;
  right: calc(clamp(16px, 1.7vw, 32px) + 24px);
  z-index: 2;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background-color .25s, transform .25s var(--ease);
}

.exh-dd__clear[hidden] {
  display: none;
}

.exh-dd__clear:hover,
.exh-dd__clear:focus-visible {
  background: var(--maroon);
  transform: translateY(-50%) scale(1.08);
}

/* menu */
.exh-dd__menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 30;
  min-width: 100%;
  max-height: 320px;
  margin: 0;
  padding: 6px;
  overflow-y: auto;
  list-style: none;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--bg);
  box-shadow: 0 22px 44px -22px rgba(26, 10, 16, .35);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity .2s ease, transform .25s var(--ease), visibility 0s linear .25s;
  cursor: default;
}

.exh-dd.is-open .exh-dd__menu {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity .2s ease, transform .25s var(--ease), visibility 0s;
}

.exh-dd__menu [role="option"] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  border-radius: 8px;
  font-family: var(--font-ui);
  font-size: .95rem;
  color: var(--ink);
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s, color .2s;
}

.exh-dd__menu [role="option"]:hover,
.exh-dd__menu [role="option"]:focus {
  outline: none;
  background: rgba(250, 32, 127, .07);
}

.exh-dd__menu [role="option"]:focus-visible {
  box-shadow: inset 0 0 0 2px var(--accent);
}

.exh-dd__tick {
  flex: 0 0 auto;
  opacity: 0;
  color: var(--accent);
}

.exh-dd__menu [aria-selected="true"] {
  color: var(--accent);
  font-weight: 500;
}

.exh-dd__menu [aria-selected="true"] .exh-dd__tick {
  opacity: 1;
}

/* active filter: tinted box, pink label + bar, bolder value */
.exh-dd.is-active {
  background: rgba(250, 32, 127, .06);
  box-shadow: inset 0 -2px 0 var(--accent);
}

.exh-dd.is-active .exh-filter__label,
.exh-dd.is-active .exh-dd__chev {
  color: var(--accent);
}

.exh-dd.is-active .exh-dd__value {
  font-weight: 500;
}

.exh-filters.has-active .exh-clear {
  color: var(--accent);
  font-weight: 500;
}

[data-theme="dark"] .exh-dd__menu {
  box-shadow: 0 22px 44px -22px rgba(0, 0, 0, .7);
}

/* phones: card-style filters keep their shape; active = pink border */
@media (max-width: 767px) {
  .exh-filters .exh-dd.is-active {
    border-color: var(--accent);
    box-shadow: none;
  }

  .exh-dd__btn {
    padding-right: 44px;
    font-size: .95rem;
  }

  .exh-dd__clear {
    right: 38px;
  }

  .exh-dd__menu {
    max-height: 60vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .exh-dd__menu,
  .exh-dd .exh-dd__chev {
    transition: none;
  }
}

/* the older ".exh-filter svg" rule positions the chevron; keep it off these icons */
.exh-filter .exh-dd__tick,
.exh-filter .exh-dd__clear svg {
  position: static;
  top: auto;
  right: auto;
  transform: none;
}

/* ===================== How to Reach: 4 travel modes + Do's & Don'ts card ===================== */
.exd-visit .exd-visit__body {
  grid-template-columns: minmax(0, 1fr);
}

/* one clickable card; opens in place inside the How to Reach panel */
.exd-dd {
  border: 1px solid #F1E2C4;
  border-radius: 14px;
  background: #FFFBF4;
  overflow: hidden;
  transition: border-color .3s, box-shadow .3s var(--ease);
}

[data-theme="dark"] .exd-dd {
  border-color: var(--line);
  background: #251d17;
}

.exd-dd:hover,
.exd-dd[open] {
  border-color: rgba(250, 32, 127, .35);
  box-shadow: 0 16px 34px -24px rgba(115, 12, 57, .45);
}

.exd-dd__head {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 22px;
  list-style: none;
  cursor: pointer;
  user-select: none;
}

.exd-dd__head::-webkit-details-marker {
  display: none;
}

.exd-dd__head:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
  border-radius: 14px;
}

.exd-dd__icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(250, 32, 127, .1);
  color: var(--pink);
}

.exd-dd__text {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.exd-dd__title {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: clamp(1.25rem, 1.6vw, 1.6rem);
  line-height: 1.15;
  letter-spacing: -.03em;
  color: var(--ink);
}

.exd-dd__intro {
  font-family: var(--font-ui);
  font-style: italic;
  font-size: 14px;
  line-height: 1.45;
  color: var(--ink-soft);
}

.exd-dd__toggle {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(26, 10, 16, .2);
  border-radius: 50%;
  color: var(--ink);
  transition: transform .35s var(--ease), background-color .3s, color .3s, border-color .3s;
}

.exd-dd:hover .exd-dd__toggle,
.exd-dd[open] .exd-dd__toggle {
  border-color: var(--pink);
  background: var(--pink);
  color: #fff;
}

.exd-dd[open] .exd-dd__toggle {
  transform: rotate(180deg);
}

/* expanded content: Do's | Don'ts side by side */
.exd-dd__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 4px 22px 24px;
  border-top: 1px solid #F1E2C4;
  animation: exd-dd-in .35s var(--ease);
}

[data-theme="dark"] .exd-dd__body {
  border-color: var(--line);
}

.exd-dd-col {
  padding-top: 18px;
}

.exd-dd-col__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 6px;
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: 17px;
  color: var(--ink);
}

.exd-dd-col__badge {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: #fff;
}

.exd-dd-col--do .exd-dd-col__badge {
  background: #1a9c6b;
}

.exd-dd-col--dont .exd-dd-col__badge {
  background: var(--pink);
}

.exd-dd-col__count {
  margin-left: auto;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(26, 10, 16, .07);
  color: var(--ink-soft);
  font-size: 12px;
}

.exd-dd-col__list {
  margin: 0;
  padding-left: 26px;
  list-style: decimal;
  font-family: var(--font-ui);
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--ink-soft);
}

.exd-dd-col__list > li {
  padding: 9px 0 9px 4px;
  border-bottom: 1px dashed rgba(26, 10, 16, .1);
}

.exd-dd-col__list > li:last-child {
  border-bottom: 0;
}

.exd-dd-col__list > li::marker {
  font-weight: 600;
}

.exd-dd-col--do .exd-dd-col__list > li::marker {
  color: #1a9c6b;
}

.exd-dd-col--dont .exd-dd-col__list > li::marker {
  color: var(--pink);
}

.exd-dd-col__sub {
  margin: 6px 0 0;
  padding-left: 20px;
  list-style: lower-alpha;
}

.exd-dd-col__sub li + li {
  margin-top: 3px;
}

.exd-dd-col__note {
  display: block;
  margin-top: 8px;
  padding: 8px 12px;
  border-left: 3px solid var(--pink);
  border-radius: 6px;
  background: rgba(250, 32, 127, .07);
  color: var(--ink);
  font-weight: 500;
  font-size: 13.5px;
}

@keyframes exd-dd-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
}

@media (max-width: 767px) {
  .exd-dd__body {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

@media (max-width: 639px) {
  .exd-dd__head {
    gap: 12px;
    padding: 16px;
  }

  .exd-dd__icon {
    width: 40px;
    height: 40px;
  }

  .exd-dd__body {
    padding: 0 16px 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .exd-dd__body {
    animation: none;
  }

  .exd-dd__toggle {
    transition: none;
  }
}

/* Do's & Don'ts card in the page's "Where" column (under How to reach) */
.exd-dd--side {
  margin-top: 22px;
}

.exd-dd--side .exd-dd__head {
  gap: 12px;
  padding: 16px;
}

.exd-dd--side .exd-dd__icon {
  width: 40px;
  height: 40px;
}

.exd-dd--side .exd-dd__title {
  font-size: 1.15rem;
}

.exd-dd--side .exd-dd__intro {
  font-size: 13px;
}

.exd-dd--side .exd-dd__toggle {
  width: 34px;
  height: 34px;
}

/* narrow column: Do's above Don'ts */
.exd-dd--side .exd-dd__body {
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0 16px 18px;
}

.exd-dd--side .exd-dd-col__list {
  font-size: 14px;
}

@media (max-width: 767px) {
  .exd2 .exd-info__item .exd-dd--side {
    grid-column: 1 / -1;
    margin-top: 16px;
  }
}

/* ===================== Do's & Don'ts: box opens a centred popup ===================== */
button.exd-dd--side {
  display: block;
  width: 100%;
  padding: 0;
  font: inherit;
  text-align: left;
  color: inherit;
  cursor: pointer;
}

button.exd-dd--side:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

button.exd-dd--side .exd-dd__head {
  display: flex;
}

.exd-guide .exd-visit__panel {
  width: min(1080px, 100%);
}

.exd-guide__head {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding-right: 110px;
}

.exd-guide__icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: rgba(250, 32, 127, .1);
  color: var(--pink);
}

.exd-guide__intro {
  margin: 8px 0 0;
  font-family: var(--font-ui);
  font-style: italic;
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink-soft);
}

.exd-guide__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  padding: 28px 48px 44px;
}

.exd-guide .exd-dd-col {
  padding: 22px 22px 14px;
  border: 1px solid #F1E2C4;
  border-radius: 14px;
  background: #FFFBF4;
}

[data-theme="dark"] .exd-guide .exd-dd-col {
  border-color: var(--line);
  background: #251d17;
}

.exd-guide .exd-dd-col--do {
  border-top: 3px solid #1a9c6b;
}

.exd-guide .exd-dd-col--dont {
  border-top: 3px solid var(--pink);
}

.exd-guide .exd-dd-col__head {
  margin-bottom: 8px;
  font-size: 19px;
}

.exd-guide .exd-dd-col__list {
  font-size: 15px;
}

@media (max-width: 899px) {
  .exd-guide__body {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 639px) {
  .exd-guide__head {
    gap: 14px;
    padding-right: 70px;
  }

  .exd-guide__icon {
    width: 44px;
    height: 44px;
  }

  .exd-guide__body {
    gap: 14px;
    padding: 18px 14px 22px;
  }

  .exd-guide .exd-dd-col {
    padding: 18px 16px 10px;
  }

  .exd-guide .exd-dd-col__list {
    font-size: 14px;
  }
}

/* ===================== Student Biennale page ===================== */
.sb {
  background: var(--bg);
  color: var(--ink);
  overflow-x: clip;
}

/* ---------- Hero ---------- */
.sb-hero {
  padding: clamp(40px, 5.4vw, 104px) var(--gutter) 0;
}

.sb-hero__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(3rem, 8.1vw, 10rem);
  line-height: .98;
  letter-spacing: -.045em;
  color: var(--ink);
}

.sb-hero__title > span {
  display: block;
}

.sb-hero__title em {
  font-style: italic;
}

.sb-hero__title b {
  font-weight: 300;
  color: var(--pink);
}

.sb-hero__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 80px);
  align-items: start;
  margin-top: clamp(36px, 3.4vw, 64px);
}

/* collage: crop the printed label off the bottom of r3.png, keep the art whole */
.sb-hero__art {
  justify-self: center;
  width: min(100%, clamp(240px, 21vw, 420px));
  aspect-ratio: 853 / 1290;
  overflow: hidden;
}

.iaadb-layout__main .sb-hero__art img {
  display: block;
  width: 119%;
  max-width: none;
  height: auto;
  margin: -21.1% 0 0 -9.5%;
}

.sb-hero__text {
  max-width: 720px;
  padding-top: 4px;
}

.sb-hero__lead {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.1rem, 1.25vw, 1.6rem);
  line-height: 1.32;
  letter-spacing: -.02em;
  color: var(--ink);
}

.sb-hero__lead a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

.sb-hero__lead a:hover {
  color: var(--accent);
}

.sb-hero__small {
  margin: clamp(16px, 1.3vw, 24px) 0 0;
  font-family: var(--font-ui);
  font-size: clamp(.82rem, .78vw, 1rem);
  line-height: 1.6;
  color: var(--ink-soft);
}

.sb-btn {
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(48px, 3.4vw, 64px);
  margin-top: clamp(28px, 2.4vw, 46px);
  padding: 0 clamp(24px, 2vw, 38px);
  border: 1px solid rgba(26, 10, 16, .4);
  background: transparent;
  color: var(--ink);
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(.9rem, .85vw, 1.05rem);
  text-decoration: none;
  cursor: pointer;
  transition: background-color .3s, color .3s, border-color .3s;
}

.sb-btn:hover,
.sb-btn:focus-visible {
  border-color: var(--pink);
  background: var(--pink);
  color: #fff;
}

/* ---------- Participate ---------- */
.sb-part {
  padding: clamp(64px, 6.4vw, 124px) var(--gutter) clamp(64px, 5.4vw, 104px);
}

.sb-part__title {
  margin: 0 0 clamp(36px, 3.6vw, 70px);
  font-family: "Season Mix-TRIAL", var(--font-display);
  font-weight: 300;
  font-size: clamp(3rem, 8.4vw, 10.5rem);
  line-height: 1;
  letter-spacing: -.02em;
  text-align: center;
}

.sb-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas:
    "who how"
    "dates how";
  gap: clamp(16px, 1.6vw, 30px);
}

.sb-card {
  position: relative;
  overflow: hidden;
  padding: clamp(24px, 1.9vw, 36px) clamp(22px, 1.9vw, 36px);
  border-radius: 4px;
  color: #fff;
  font-family: var(--font-ui);
}

.sb-card__title {
  margin: 0 0 clamp(14px, 1.2vw, 22px);
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.7rem, 2.6vw, 3.4rem);
  line-height: 1.05;
  letter-spacing: -.035em;
  color: #fff;
}

.sb-card__title em {
  font-style: italic;
}

.sb-card p {
  margin: 0;
  font-weight: 300;
  font-size: clamp(.86rem, .85vw, 1.05rem);
  line-height: 1.45;
  color: rgba(255, 255, 255, .9);
}

/* Who can apply: soft pink gradient */
.sb-card--who {
  grid-area: who;
  background:
    radial-gradient(70% 90% at 15% 20%, #fb9cbd 0%, transparent 70%),
    radial-gradient(60% 80% at 85% 80%, #f7799f 0%, transparent 70%),
    linear-gradient(110deg, #f8749f 0%, #f9889f 45%, #f6567e 100%);
}

.sb-card--who p {
  max-width: 34ch;
}

.sb-card--who p + p {
  margin-top: 1.1em;
}

/* Important dates: saffron */
.sb-card--dates {
  grid-area: dates;
  background: #DF8E00;
}

.sb-dates {
  display: flex;
  flex-wrap: wrap;
  gap: 14px clamp(28px, 3vw, 72px);
  margin: 0;
}

.sb-dates dt {
  font-size: clamp(.62rem, .55vw, .72rem);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .92);
}

.sb-dates dd {
  margin: 8px 0 0;
  font-weight: 300;
  font-size: clamp(.9rem, .95vw, 1.15rem);
  color: rgba(255, 255, 255, .95);
}

.sb-venue {
  display: inline-block;
  margin: clamp(22px, 2.3vw, 44px) 0 0 !important;
  padding: 6px 14px;
  border-radius: 3px;
  background: #FFF4E2;
  color: var(--ink) !important;
  font-weight: 400 !important;
  font-size: clamp(.82rem, .8vw, 1rem) !important;
}

/* How to apply: pink fading to near-black, line-art student on the right */
.sb-card--how {
  grid-area: how;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: clamp(420px, 30vw, 590px);
  background:
    linear-gradient(180deg, #fd9fc4 0%, #f2559a 40%, #e2246f 62%, #4d0a26 88%, #1d0611 100%);
}

.sb-card__how-text,
.sb-card__how-foot {
  position: relative;
  z-index: 1;
  max-width: 50%;
}

.sb-card__sub {
  margin-top: -6px !important;
}

.iaadb-layout__main .sb-card__art {
  position: absolute;
  right: clamp(16px, 2vw, 40px);
  bottom: clamp(20px, 2.4vw, 46px);
  z-index: 0;
  width: 42%;
  max-width: 340px;
  height: auto;
  pointer-events: none;
}

.sb-card__strong {
  margin-bottom: 12px !important;
  font-weight: 600 !important;
  font-size: clamp(1.05rem, 1.2vw, 1.5rem) !important;
  line-height: 1.2 !important;
  color: #fff !important;
}

.sb-card__fine {
  font-size: clamp(.78rem, .7vw, .9rem) !important;
}

.sb-card__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 28px;
  margin-top: clamp(28px, 4vw, 90px);
}

.sb-btn--light {
  margin-top: 0;
  min-height: 42px;
  padding: 0 26px;
  border-color: rgba(255, 255, 255, .85);
  color: #fff;
  border-radius: 10px;
}

.sb-btn--light:hover,
.sb-btn--light:focus-visible {
  border-color: #fff;
  background: #fff;
  color: var(--pink);
}

.sb-link {
  color: #fff;
  font-size: clamp(.82rem, .78vw, .98rem);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.sb-link:hover {
  color: #ffd1e3;
}

/* ---------- Open Call popup (uses the exd-visit dialog shell) ---------- */
.sb-modal .exd-visit__panel {
  width: min(1280px, 100%);
}

.sb-modal__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
  gap: 32px;
  padding: 36px 48px 48px;
}

.sb-prompt {
  padding: 28px 32px;
  border: 1px solid #F1E2C4;
  border-radius: 12px;
  background: #FFFBF4;
  font-family: var(--font-ui);
}

.sb-prompt p {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
  color: var(--ink-soft);
}

.sb-prompt .sb-prompt__line {
  display: flex;
  align-items: baseline;
  gap: .25em;
  margin-top: 18px;
  font-weight: 300;
  font-size: clamp(2.2rem, 3.6vw, 4.2rem);
  line-height: 1.05;
  letter-spacing: -.04em;
  color: var(--ink);
}

.sb-prompt__blank {
  flex: 1;
  max-width: 420px;
  height: .1em;
  border-bottom: 3px dashed var(--pink);
  border-bottom-style: solid;
  background: repeating-linear-gradient(90deg, var(--pink) 0 10px, transparent 10px 14px);
  border: 0;
}

.sb-feats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 16px;
}

.sb-feat {
  padding: 22px 22px 24px;
  border: 1px solid #F1E2C4;
  border-radius: 12px;
  background: #FFFBF4;
  font-family: var(--font-ui);
}

.sb-feat h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 10px;
  font-weight: 600;
  font-size: 19px;
  color: var(--ink);
}

.sb-feat h3 svg {
  flex: 0 0 auto;
  color: var(--pink);
}

.sb-feat p {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--ink-soft);
}

.sb-ways {
  position: relative;
  overflow: hidden;
  padding: 30px 30px 26px;
  border-radius: 12px;
  color: #fff;
  font-family: var(--font-ui);
  background: linear-gradient(180deg, #9c4f72 0%, #c63c74 28%, #ea2a74 50%, #7a0f3c 76%, #1d0510 100%);
}

.sb-ways__eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .85);
}

.sb-ways__title {
  margin: 20px 0 0;
  font-weight: 300;
  font-size: 34px;
  line-height: 1.1;
  letter-spacing: -.04em;
}

.sb-ways__intro {
  margin: 14px 0 6px;
  font-size: 14.5px;
  line-height: 1.5;
  color: rgba(255, 255, 255, .88);
}

.sb-ways__list {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: ways;
}

.sb-ways__list li {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 13px 0;
  border-bottom: 1px solid rgba(255, 255, 255, .22);
  font-size: 18px;
  counter-increment: ways;
}

.sb-ways__list li::before {
  content: counter(ways, decimal-leading-zero);
  min-width: 22px;
  font-family: "Season Mix-TRIAL", var(--font-display);
  font-style: italic;
  font-weight: 300;
  font-size: 17px;
  color: rgba(255, 255, 255, .7);
}

.sb-ways__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 54px;
  margin-top: 24px;
  border-radius: 2px;
  background: #fff;
  color: var(--pink);
  font-weight: 600;
  font-size: 16px;
  text-decoration: none;
  transition: background-color .3s, color .3s;
}

.sb-ways__btn:hover,
.sb-ways__btn:focus-visible {
  background: #FFE4EF;
}

.sb-ways__note {
  margin: 16px 0 0;
  font-size: 12px;
  line-height: 1.55;
  text-align: center;
  color: rgba(255, 255, 255, .78);
}

.sb-ways__note a {
  color: inherit;
}

/* ---------- Tablet ---------- */
@media (max-width: 1023px) {
  .sb-modal__body {
    grid-template-columns: 1fr;
  }

  .sb-card__how-text,
  .sb-card__how-foot {
    max-width: 58%;
  }
}

/* ---------- Mobile (reference: 390px) ---------- */
@media (max-width: 767px) {
  .sb-hero {
    padding-top: 36px;
  }

  .sb-hero__title {
    font-size: clamp(2.4rem, 11.5vw, 3.4rem);
  }

  .sb-hero__body {
    grid-template-columns: 1fr;
    gap: 28px;
    margin-top: 22px;
  }

  .sb-hero__art {
    width: min(80%, 300px);
  }

  .sb-hero__text {
    text-align: center;
  }

  .sb-hero__lead {
    font-size: 1.2rem;
  }

  .sb-hero__small {
    font-size: .92rem;
  }

  .sb-part__title {
    font-size: clamp(2.8rem, 15vw, 4rem);
  }

  .sb-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "who"
      "how"
      "dates";
  }

  .sb-card__title {
    font-size: 2rem;
  }

  .sb-card p {
    font-size: .98rem;
  }

  /* How to apply: text, illustration, then the rest, all stacked */
  .sb-card--how {
    min-height: 0;
  }

  .sb-card__how-text,
  .sb-card__how-foot {
    max-width: none;
  }

  .iaadb-layout__main .sb-card__art {
    position: relative;
    right: auto;
    bottom: auto;
    width: min(90%, 320px);
    margin: 20px auto 24px;
  }

  .sb-card__actions {
    margin-top: 22px;
  }

  .sb-dates {
    flex-direction: column;
    gap: 0;
  }

  .sb-dates > div {
    padding: 14px 0;
    border-top: 1px solid rgba(255, 255, 255, .35);
  }

  .sb-dates dd {
    font-size: 1.15rem;
  }

  .sb-modal__body {
    gap: 14px;
    padding: 20px 14px 22px;
  }

  .sb-prompt {
    padding: 22px 20px;
  }

  .sb-prompt p {
    font-size: 17px;
  }

  .sb-prompt .sb-prompt__line {
    font-size: 2.6rem;
  }

  .sb-feats {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .sb-feat {
    padding: 22px 22px 24px;
  }

  .sb-feat h3 {
    font-size: 19px;
  }

  .sb-ways {
    padding: 26px 22px 24px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sb-btn,
  .sb-ways__btn {
    transition: none;
  }
}

/* Leadership quotes: “ and ” sit inline, an equal small gap from the first and last word */
.ldr .ldr__q,
.ldr .ldr__q--open,
.ldr .ldr__q--close,
.ldr .ldr__quote .ldr__q--open,
.ldr .ldr__quote .ldr__q--close {
  display: inline-block;
  width: auto;
  height: auto;
  margin: 0;
  font-size: 1.7em;
  line-height: 0;
  vertical-align: -0.32em;
  transform: none;
}

.ldr .ldr__q--open,
.ldr .ldr__quote .ldr__q--open {
  margin-right: 0.12em;
}

.ldr .ldr__q--close,
.ldr .ldr__quote .ldr__q--close {
  margin-left: 0.12em;
}

.ldr__nowrap {
  white-space: nowrap;
}

/* Student Biennale "Participate": two equal cards — Important Dates | How to Apply */
.sb .sb-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-areas: "dates how";
  align-items: stretch;
}

.sb .sb-card--how {
  display: block;
  min-height: 0;
  background: linear-gradient(180deg, #fd9fc4 0%, #f2559a 35%, #e2246f 62%, #4d0a26 90%, #1d0611 100%);
}

.sb .sb-card__how-text {
  max-width: 58%;
}

.sb .sb-card--how .sb-card__fine {
  font-size: clamp(.82rem, .82vw, 1rem) !important;
  line-height: 1.45;
}

.sb .sb-card--how .sb-btn--light {
  margin-top: clamp(22px, 2.4vw, 46px);
}

/* line-art student on the right, fitted to the card height */
.iaadb-layout__main .sb .sb-card__art {
  top: clamp(12px, 1.2vw, 24px);
  bottom: clamp(12px, 1.2vw, 24px);
  right: clamp(14px, 2vw, 40px);
  width: auto;
  height: calc(100% - 2 * clamp(12px, 1.2vw, 24px));
  max-width: 40%;
  object-fit: contain;
  object-position: right center;
}

@media (max-width: 1023px) {
  .sb .sb-card__how-text {
    max-width: 62%;
  }
}

/* phones: stacked, Dates first; illustration sits under the text */
@media (max-width: 767px) {
  .sb .sb-grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "dates"
      "how";
  }

  .sb .sb-card__how-text {
    max-width: none;
  }

  .iaadb-layout__main .sb .sb-card__art {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    display: block;
    width: min(80%, 300px);
    height: auto;
    max-width: none;
    margin: 24px auto 0;
  }
}

/* Home hero line art: white in dark mode, like the Qutub Minar drawing */
[data-theme="dark"] .hero__art {
  filter: invert(1) hue-rotate(180deg) brightness(1.1);
  opacity: .7;
}

/* =====================================================================
   Contact page: title, intro on the left, contact rows on the right.
   Tablet (max 1023px) narrows the gap; phones (max 767px) stack it all.
   ===================================================================== */
.ct {
  --ct-line: rgba(26, 10, 16, 0.18);
  padding: clamp(32px, 4.2vw, 80px) var(--gutter) clamp(80px, 8vw, 160px);
  background: var(--bg);
  color: var(--ink);
}

[data-theme="dark"] .ct {
  --ct-line: rgba(255, 247, 233, 0.22);
}

.ct__title {
  margin: 0;
  font-family: "Season Mix-TRIAL", var(--font-display);
  font-weight: 300;
  font-size: clamp(3.2rem, 8.4vw, 11.5rem);
  line-height: 1;
  letter-spacing: -.02em;
}

.ct__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 80px);
  margin-top: clamp(40px, 4.7vw, 90px);
}

.ct__intro {
  padding-top: clamp(22px, 2.3vw, 44px);
  max-width: 28rem;
}

.ct__lead,
.ct__value {
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.3rem, 1.7vw, 2.1rem);
  line-height: 1.25;
  letter-spacing: -.02em;
}

.ct__lead {
  margin: 0;
}

.ct__text {
  margin: clamp(16px, 1.6vw, 30px) 0 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(.92rem, .9vw, 1.05rem);
  line-height: 1.65;
  opacity: .72;
}

.ct__list {
  margin: 0;
  border-top: 1px solid var(--ct-line);
}

.ct__row {
  display: grid;
  /* fixed action column, so every value starts on the same line */
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) clamp(84px, 7vw, 130px);
  align-items: start;
  column-gap: clamp(16px, 2vw, 40px);
  padding: clamp(22px, 2.3vw, 44px) 0;
  border-bottom: 1px solid var(--ct-line);
}

.ct__row:last-child {
  border-bottom: 0;
}

.ct__label {
  padding-top: .55em;
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(.72rem, .72vw, .88rem);
  line-height: 1.2;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--pink);
}

.ct__value {
  margin: 0;
  overflow-wrap: anywhere;
}

.ct__action {
  grid-column: 3;
  justify-self: end;
  margin: 0;
  padding-top: .45em;
}

.ct__action a {
  font-family: var(--font-ui);
  font-weight: 600;
  font-size: clamp(.68rem, .68vw, .82rem);
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ct__action a:hover {
  color: var(--pink);
}

.ct__action a:focus-visible {
  outline: 2px solid var(--pink);
  outline-offset: 3px;
}

@media (max-width: 1023px) {
  .ct__body {
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  }

  .ct__row {
    grid-template-columns: minmax(0, 1fr) 96px;
    row-gap: 6px;
  }

  .ct__action {
    grid-column: 2;
  }

  .ct__label {
    grid-column: 1 / -1;
    padding-top: 0;
  }
}

@media (max-width: 767px) {
  .ct__body {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    margin-top: 28px;
  }

  .ct__intro {
    padding-top: 0;
    max-width: none;
  }

  .ct__lead,
  .ct__value {
    font-size: clamp(1.3rem, 6vw, 1.6rem);
  }

  .ct__text {
    font-size: .95rem;
  }

  .ct__list {
    margin-top: 40px;
  }

  .ct__row {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 10px;
    padding: 24px 0;
  }

  .ct__label {
    font-size: .8rem;
  }

  .ct__action {
    grid-column: 1;
    justify-self: start;
    padding-top: 2px;
  }

  .ct__action a {
    font-size: .78rem;
    letter-spacing: .08em;
  }
}

/* Do's & Don'ts popup: questions below both columns, full width */
.exd-guide .exd-guide__faq {
  grid-column: 1 / -1;
  border-top: 3px solid var(--maroon);
}

.exd-guide__faq .exd-dd-col__badge {
  background: var(--maroon);
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 15px;
}

.exd-guide__faq-lead {
  margin: 0 0 4px;
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.55;
  color: var(--ink);
}

.exd-guide__faq .exd-dd-col__list > li::marker {
  color: var(--maroon);
}

[data-theme="dark"] .exd-guide .exd-guide__faq {
  border-top-color: var(--pink);
}

[data-theme="dark"] .exd-guide__faq .exd-dd-col__badge {
  background: var(--pink);
}

[data-theme="dark"] .exd-guide__faq .exd-dd-col__list > li::marker {
  color: var(--pink);
}

@media (max-width: 639px) {
  .exd-guide__faq-lead {
    font-size: 14px;
  }
}

/* =====================================================================
   Exhibitions: "More to Come" note under the Galleries & Institutions and
   International cards. Small cream card in the right corner, with a warm
   sun and a dashed inner edge (like the Biennale Pass ticket); full width on phones.
   ===================================================================== */
.exh-more {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(10px, .9vw, 16px);
  width: min(100%, 440px);
  margin: clamp(28px, 3vw, 52px) 0 0 auto;
  padding: clamp(22px, 1.9vw, 32px) clamp(22px, 2vw, 34px);
  overflow: hidden;
  isolation: isolate;
  border: 1px solid #EADBBE;
  border-radius: 8px;
  background: linear-gradient(115deg, #FBEFD9 0%, #FDF4E4 50%, var(--cream) 100%);
  color: var(--ink);
}

/* dashed inner edge, echoing the pass ticket */
.exh-more::after {
  content: '';
  position: absolute;
  inset: 8px;
  z-index: -1;
  border: 1px dashed #DCC59B;
  border-radius: 4px;
  pointer-events: none;
}

/* warm sun rising behind the text */
.exh-more__sun {
  position: absolute;
  right: -50px;
  bottom: -70px;
  z-index: -1;
  width: clamp(140px, 11vw, 190px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, rgba(223, 142, 0, .22), rgba(223, 142, 0, .08) 60%, transparent 70%);
  animation: exh-more-rise 9s ease-in-out infinite alternate;
}

.exh-more__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 clamp(8px, .8vw, 14px);
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(.68rem, .66vw, .8rem);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--maroon);
}

.exh-more__dots {
  display: inline-flex;
  gap: 4px;
}

.exh-more__dots i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  animation: exh-more-dot 1.4s ease-in-out infinite;
}

.exh-more__dots i:nth-child(2) {
  animation-delay: .2s;
}

.exh-more__dots i:nth-child(3) {
  animation-delay: .4s;
}

.exh-more__title {
  margin: 0;
  font-family: "Season Mix-TRIAL", var(--font-display);
  font-weight: 300;
  font-size: clamp(2rem, 2.5vw, 3rem);
  line-height: .95;
  letter-spacing: -.02em;
  color: var(--ink);
}

.exh-more__title em {
  font-style: italic;
  color: var(--pink);
}

.exh-more__text {
  margin: 0;
  padding-left: 14px;
  border-left: 2px solid #DCC59B;
  font-family: var(--font-ui);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(.92rem, .9vw, 1.05rem);
  line-height: 1.5;
  color: var(--ink-soft);
}

[data-theme="dark"] .exh-more {
  border-color: rgba(255, 247, 233, .16);
  background: linear-gradient(115deg, #2a2119 0%, #231b15 55%, var(--bg) 100%);
}

[data-theme="dark"] .exh-more::after,
[data-theme="dark"] .exh-more__text {
  border-color: rgba(255, 247, 233, .22);
}

[data-theme="dark"] .exh-more__eyebrow {
  color: var(--pink);
}

@keyframes exh-more-dot {
  0%, 100% {
    opacity: .25;
    transform: translateY(0);
  }

  50% {
    opacity: 1;
    transform: translateY(-3px);
  }
}

@keyframes exh-more-rise {
  from {
    transform: translateY(10px) scale(.97);
  }

  to {
    transform: translateY(-10px) scale(1.03);
  }
}

@media (max-width: 767px) {
  .exh-more {
    width: 100%;
    padding: 24px 20px 26px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .exh-more__sun,
  .exh-more__dots i {
    animation: none;
  }

  .exh-more__dots i {
    opacity: .6;
  }
}

/* Explore: all four card names one size, sized to the card so
   "The Student Biennale" stays on one line at every width */
.exp-card .exp-card__name {
  font-size: 8.6cqi;
  white-space: nowrap;
}

/* Student Biennale hero: edition line, "About the Institution" and contact details */
.sb-hero__eyebrow {
  margin: 0 0 clamp(12px, 1.1vw, 20px);
  font-family: var(--font-ui);
  font-weight: 500;
  font-size: clamp(.72rem, .72vw, .86rem);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pink);
}

.sb-inst {
  margin-top: clamp(28px, 2.6vw, 48px);
  padding-top: clamp(24px, 2.2vw, 40px);
  border-top: 1px solid rgba(26, 10, 16, .14);
}

[data-theme="dark"] .sb-inst,
[data-theme="dark"] .sb-inst__contact {
  border-color: rgba(255, 247, 233, .18);
}

.sb-inst__title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 300;
  font-size: clamp(1.35rem, 1.6vw, 2rem);
  line-height: 1.2;
  letter-spacing: -.02em;
  color: var(--ink);
}

.sb-inst .sb-hero__small:first-of-type {
  margin-top: clamp(12px, 1vw, 18px);
}

.sb-inst__contact {
  display: grid;
  gap: 12px;
  margin: clamp(22px, 1.8vw, 32px) 0 0;
  padding: clamp(18px, 1.5vw, 26px) 0 0;
  border-top: 1px dashed rgba(26, 10, 16, .18);
  font-family: var(--font-ui);
  font-size: clamp(.86rem, .8vw, 1rem);
  line-height: 1.5;
}

.sb-inst__contact > div {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  gap: 16px;
  align-items: baseline;
}

.sb-inst__contact dt {
  font-weight: 500;
  font-size: .75em;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pink);
}

.sb-inst__contact dd {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--ink);
}

.sb-inst__contact a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

.sb-inst__contact a:hover {
  color: var(--pink);
}

@media (max-width: 767px) {
  .sb-inst__contact > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }
}

/* Student Biennale hero: poster image shown whole (no collage crop) */
.sb-hero__art--poster {
  aspect-ratio: auto;
  overflow: visible;
}

.iaadb-layout__main .sb-hero__art--poster img {
  width: 100%;
  height: auto;
  margin: 0;
  object-fit: contain !important;
}

/* Explore: The Student Biennale poster (4:5), centred and always whole above
   the panel (--exp-panel-h is the panel height, set by script.js) */
.iaadb-layout__main .exp-card--pink .exp-card__img {
  top: 5%;
  left: 50%;
  width: auto;
  height: min(75cqi, calc(95% - var(--exp-panel-h, 34%) - 14px));
  border-radius: 4px;
  box-shadow: 0 10px 28px rgba(26, 10, 16, .22);
  transform: translateX(-50%);
}

.exp-card--pink:hover .exp-card__img,
.exp-card--pink:focus-visible .exp-card__img {
  transform: translateX(-50%) scale(1.035);
}

@media (prefers-reduced-motion: reduce) {
  .exp-card--pink:hover .exp-card__img {
    transform: translateX(-50%);
  }
}

/* ===================== Hero "Explore" button (scrolls to #explore-sec) ===================== */
.hero__explore {
  position: relative;
  z-index: 3;
  order: 6;
  align-self: center;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  height: 58px;
  margin-top: clamp(16px, 3.2vh, 40px);
  padding: 0 48px;
  border: 1px solid var(--pink);
  border-radius: 10px;
  background: transparent;
  color: var(--pink);
  font-size: 1.05rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
  overflow: hidden;
  isolation: isolate;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 0 0 rgba(250, 32, 127, 0);
  transition: color .45s var(--ease), letter-spacing .5s var(--ease), box-shadow .5s var(--ease), transform .4s var(--ease);
  animation: hero-explore-in .9s var(--ease) .6s both;
}

/* pink fill that rises from the bottom on hover */
.hero__explore::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--pink);
  transform: translateY(101%);
  transition: transform .55s var(--ease);
}

.hero__explore:hover,
.hero__explore:focus-visible {
  color: #fff;
  letter-spacing: .24em;
  box-shadow: 0 12px 30px -10px rgba(250, 32, 127, .55);
}

.hero__explore:hover::before,
.hero__explore:focus-visible::before {
  transform: translateY(0);
}

.hero__explore:active {
  transform: scale(.97);
}

.hero__explore:focus-visible {
  outline: 2px solid var(--pink);
  outline-offset: 4px;
}

/* the section receives focus after the scroll; no ring needed there */
.explore-sec:focus {
  outline: none;
}

@keyframes hero-explore-in {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}

[data-theme="dark"] .hero__explore {
  border-color: var(--accent);
  color: var(--accent);
}

[data-theme="dark"] .hero__explore:hover,
[data-theme="dark"] .hero__explore:focus-visible {
  color: #fff;
}

/* phones: sits under the pass button, full width like it */
@media (max-width: 767px) {
  .hero .hero__explore {
    width: calc(100% - 2 * var(--gutter));
    max-width: 640px;
    min-width: 0;
    height: 52px;
    margin-top: 12px;
    padding: 0 24px;
    font-size: .95rem;
  }

  /* no hover on touch: keep the spacing steady */
  .hero .hero__explore:hover {
    letter-spacing: .18em;
  }
}

/* landscape phones: the hero is viewport-tall, keep the button compact */
@media (max-height: 480px) and (orientation: landscape) {
  .hero .hero__explore {
    height: 36px;
    min-width: 160px;
    margin-top: 6px;
    padding: 0 28px;
    font-size: .8rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero__explore {
    animation: none;
    transition: none;
  }
}

/* =====================================================================
   Leadership messages: each portrait stands on a gold name plaque.
   PM: quote on the left, photo + plaque on the right. Minister and
   Secretary: photo, plaque, then the quote centred below, side by side.
   The byline (.ldr__by) becomes the plaque; the figures use
   display: contents so it can sit under the photo without HTML changes.
   ===================================================================== */
.iaadb-layout__main .ldr .ldr__by {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .3em;
  justify-self: center;
  margin: -1px auto 0;
  padding: clamp(10px, 1.05vw, 22px) clamp(14px, 1.6vw, 32px);
  text-align: center;
  border: 1px solid rgba(236, 214, 176, .26);
  border-radius: clamp(8px, .75vw, 16px);
  background:
    linear-gradient(180deg, rgba(255, 244, 222, .14), rgba(255, 244, 222, 0) 55%),
    linear-gradient(100deg, rgba(112, 92, 68, .62) 0%, rgba(150, 124, 90, .86) 42%, #c6a87b 100%);
  box-shadow:
    0 22px 44px -22px rgba(18, 10, 2, .75),
    inset 0 1px 0 rgba(255, 240, 214, .3);
}

.iaadb-layout__main .ldr .ldr__name {
  font-weight: 600;
  color: #000;
  text-shadow: 0 1px 2px rgba(40, 26, 10, .25);
}

.iaadb-layout__main .ldr .ldr__role {
  margin: 0;
  /* color: rgba(255, 255, 255, .9); */
  color: #000;
}

/* portraits: no frame, the cut-out stands straight on the plaque */
.iaadb-layout__main .ldr .ldr__pm-photo,
.iaadb-layout__main .ldr .ldr__photo {
  border: 0;
  border-radius: 0;
  overflow: visible;
}

/* ---------- Prime Minister ---------- */
.iaadb-layout__main .ldr .ldr__pm {
  grid-template-columns: minmax(0, 42fr) minmax(0, 38fr);
  grid-template-rows: auto auto;
  column-gap: 4vw;
  row-gap: 0;
  align-items: start;
}

.iaadb-layout__main .ldr .ldr__pm-text {
  display: contents;
}

.iaadb-layout__main .ldr .ldr__pm-quote {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}

.iaadb-layout__main .ldr .ldr__pm-photo {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  margin: 0;
}

.iaadb-layout__main .ldr .ldr__pm .ldr__by {
  grid-column: 2;
  grid-row: 2;
  width: 80%;
}

/* ---------- Minister / Secretary ---------- */
.iaadb-layout__main .ldr .ldr__card--left,
.iaadb-layout__main .ldr .ldr__card--right {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  margin-top: 10vw;
}

.iaadb-layout__main .ldr .ldr__text {
  display: contents;
}

.iaadb-layout__main .ldr .ldr__photo {
  width: 64%;
  margin: 0 auto;
}

/* sized so both portraits are the same height and the two plaques line up */
.iaadb-layout__main .ldr .ldr__card--right .ldr__photo {
  width: 58.3%;
}

.iaadb-layout__main .ldr .ldr__card .ldr__by {
  order: 1;
  width: 92%;
}

.iaadb-layout__main .ldr .ldr__quote {
  order: 2;
  width: 100%;
  margin-top: clamp(14px, 1.5vw, 30px);
  text-align: center;
}

/* ---------- Tablet + phones: one centred column ---------- */
@media (max-width: 899px) {
  .iaadb-layout__main .ldr .ldr__pm {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin: 0;
  }

  .iaadb-layout__main .ldr .ldr__pm-quote {
    align-self: stretch;
    margin-bottom: 32px;
  }

  .iaadb-layout__main .ldr .ldr__pm-photo {
    order: 1;
    width: min(100%, 460px);
  }

  .iaadb-layout__main .ldr .ldr__pm .ldr__by {
    order: 2;
    width: min(80%, 370px);
  }

  .iaadb-layout__main .ldr .ldr__card--left,
  .iaadb-layout__main .ldr .ldr__card--right {
    align-self: stretch;
    width: 100%;
    margin-top: 0;
  }

  .iaadb-layout__main .ldr .ldr__photo,
  .iaadb-layout__main .ldr .ldr__card--right .ldr__photo {
    width: min(60%, 260px);
  }

  .iaadb-layout__main .ldr .ldr__card .ldr__by {
    width: min(88%, 360px);
  }

  .iaadb-layout__main .ldr .ldr__quote {
    max-width: 560px;
    margin-top: 20px;
  }

  .iaadb-layout__main .ldr .ldr__name,
  .iaadb-layout__main .ldr .ldr__card .ldr__name {
    font-size: clamp(1.05rem, 4.4vw, 1.3rem);
    line-height: 1.2;
  }

  .iaadb-layout__main .ldr .ldr__role,
  .iaadb-layout__main .ldr .ldr__card .ldr__role {
    font-size: clamp(.78rem, 3.2vw, .9rem);
  }
}

/* =====================================================================
   Header buttons: the pink "Get Biennale Pass" ticket, then an outlined
   maroon "Download App" (laptops and desktops; icon only on tablets).
   On phones both sit side by side in the home hero, where the pass
   button already was.
   ===================================================================== */
.site-header__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-right: var(--gutter);
  z-index: 2;
}

/* the pass button sits in the group now, so the group carries the edge gap */
.site-header__actions .btn-pass {
  right: auto;
}

.btn-app {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 24px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--deep);
  border-radius: 8px;
  color: var(--deep);
  background: transparent;
  font-family: var(--font-ui);
  font-size: 1.05rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  transition: color .4s var(--ease), transform .4s var(--ease), box-shadow .4s var(--ease);
}

/* same slide-up fill as the pass button, in maroon */
.btn-app::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--deep);
  transform: translateY(101%);
  transition: transform .5s var(--ease);
}

.btn-app__icon {
  display: block;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  transition: transform .4s var(--ease);
}

.btn-app:hover,
.btn-app:focus-visible {
  color: var(--bg);
  transform: translateY(-2px);
  box-shadow: 0 10px 18px -10px rgba(115, 12, 57, .45);
}

.btn-app:hover::before,
.btn-app:focus-visible::before {
  transform: translateY(0);
}

.btn-app:hover .btn-app__icon,
.btn-app:focus-visible .btn-app__icon {
  transform: translateY(1px);
}

.btn-app:focus-visible {
  outline: 2px solid var(--deep);
  outline-offset: 3px;
}

.site-header .btn-app {
  height: 63px;
  padding: 0 26px;
}

@media (min-width: 900px) {
  .site-header.is-scrolled .btn-app {
    height: 52px;
  }
}

/* narrower desktops: slimmer buttons so the pair never meets the centred logo */
@media (max-width: 1439px) {
  .site-header__actions .btn-pass {
    padding: 0 28px;
  }

  .site-header .btn-app {
    padding: 0 20px;
  }
}

@media (max-width: 1365px) {
  .site-header__actions {
    gap: 10px;
  }

  .site-header__actions .btn-pass,
  .site-header .btn-app {
    height: 52px;
    font-size: .95rem;
  }

  .site-header__actions .btn-pass {
    padding: 0 22px;
  }

  .site-header .btn-app {
    gap: 8px;
    padding: 0 16px;
  }
}

/* small laptops and tablets: "Download App" becomes a square icon button
   (its label stays for screen readers) so the pair clears the centred logo */
@media (max-width: 1199px) {
  .site-header .btn-app {
    width: 52px;
    padding: 0;
  }

  .site-header .btn-app__text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
}

@media (max-width: 1023px) {
  .site-header__actions {
    gap: 8px;
  }

  .site-header__actions .btn-pass {
    padding: 0 20px;
  }
}

/* phones: the header pair is replaced by the two buttons in the hero */
@media (max-width: 767px) {
  .site-header__actions {
    display: none;
  }

  .hero .hero__cta {
    flex-direction: row;
    align-items: stretch;
    gap: 10px;
  }

  .hero .hero__cta .btn-pass,
  .hero .hero__cta .btn-app {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    height: auto;
    min-height: 52px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 500;
  }

  .hero .hero__cta .btn-app {
    gap: 8px;
  }
}

@media (max-width: 374px) {
  .hero .hero__cta {
    gap: 8px;
  }

  .hero .hero__cta .btn-pass,
  .hero .hero__cta .btn-app {
    padding: 0 6px;
    font-size: .875rem;
  }

  .hero .hero__cta .btn-app {
    gap: 6px;
  }

  .hero .hero__cta .btn-app__icon {
    width: 17px;
    height: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {

  .btn-app,
  .btn-app::before,
  .btn-app__icon {
    transition: none;
  }

  .btn-app:hover,
  .btn-app:focus-visible {
    transform: none;
  }
}