/* Ported from the frozen S1 prototype (home-dussehra.css). Rules unchanged: scripts/css-check.mjs proves it. Only comments differ, with the sample tenant's name removed. */
/* S1 · Home, Dussehra seasonal version. Loaded after home.css (read-only); every rule here is
   scoped to this page (.dh-page) or its Hero (.dh). the tenant palette and type, warmed for the
   festival: cream words and lamp gold over the lamp-lit photograph, the button in the tenant plum. */

:root {
  --dh-cream: #f3e3c3;        /* words on the photograph */
  --dh-cream-soft: #e8d3ad;
  --dh-gold: #d6b06a;         /* line-work on the photograph (the regular --hx-gold is for ivory) */
  --dh-night: 20, 4, 8;       /* the shade under the words, as rgb */
}

/* ── Header over the photograph: see-through and cream at the top ───────────────────── */
html.hm-top .dh-page .sc-header .sc-iconbtn,
html.hm-top .dh-page .sc-header .sc-nav__link { color: var(--dh-cream); }
html.hm-top .dh-page .sc-header .sc-nav__link:hover { color: #fff; border-bottom-color: var(--dh-gold); }
html.hm-top .dh-page .sc-header__left::after { background: color-mix(in srgb, var(--dh-cream) 45%, transparent); }
html.hm-top .dh-page .sc-header .sc-iconbtn,
html.hm-top .dh-page .sc-header .sc-nav__link { text-shadow: 0 1px 8px rgba(var(--dh-night), 0.6); }
html.hm-top .dh-page .sc-header .sc-iconbtn svg { filter: drop-shadow(0 1px 4px rgba(var(--dh-night), 0.55)); }

/* ── Hero ─────────────────────────────────────────────────────────────────────────── */
.dh--measure, .dh--measure * { transition: none !important; } /* Hero fix (a): fit() measures settled sizes */
.dh--measure .dh__text > *, .dh--measure .dh__feats li { transform: none !important; } /* ...and the words at rest, not mid-entrance */
.dh { position: relative; isolation: isolate; margin-top: calc(-1 * var(--hx-hdr)); background: #1d0709; color: var(--dh-cream); }
.dh__stage { position: relative; overflow: hidden; }
.dh--wide .dh__stage { height: max(600px, min(100svh, 56.25vw)); }
.dh--tall .dh__stage { height: max(560px, 100svh); max-height: 1180px; }
.dh__media { position: absolute; inset: 0; will-change: transform; }
.dh--sky .dh__media { bottom: auto; height: 100%; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 70px); mask-image: linear-gradient(180deg, transparent 0, #000 70px); }
/* Short phones: the crest and its rule step aside so the words fit above her. */
.dh--compact .dh__crest, .dh--compact .dh__text > .dh__rule:first-of-type { display: none; }
.dh--compact .dh__eyebrow { margin-top: 0; }
.dh__media > .ph-img { animation: hx-zoom 2600ms var(--hm-ease-out) both; }

/* Shade: dark where the words are, clear over her; a band under the header. */
.dh__shade { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.dh--wide .dh__shade { background:
  linear-gradient(180deg, rgba(var(--dh-night), 0.6) 0%, rgba(var(--dh-night), 0) calc(var(--hx-hdr) + 60px)),
  linear-gradient(90deg, rgba(var(--dh-night), 0.78) 0%, rgba(var(--dh-night), 0.6) 24%, rgba(var(--dh-night), 0.22) 40%, rgba(var(--dh-night), 0) 52%),
  linear-gradient(0deg, rgba(var(--dh-night), 0.5) 0%, rgba(var(--dh-night), 0) 26%); }
.dh--tall .dh__shade { background:
  linear-gradient(180deg, rgba(var(--dh-night), 0.6) 0%, rgba(var(--dh-night), 0) calc(var(--hx-hdr) + 50px)),
  radial-gradient(110% 62% at 0% 8%, rgba(var(--dh-night), 0.72), rgba(var(--dh-night), 0.35) 55%, rgba(var(--dh-night), 0) 80%),
  linear-gradient(0deg, rgba(var(--dh-night), 0.82) 0%, rgba(var(--dh-night), 0.4) 14%, rgba(var(--dh-night), 0) 26%); }

/* Lamplight: soft warm glows breathing over the flames. */
.dh__glows { position: absolute; inset: 0; z-index: 1; pointer-events: none; mix-blend-mode: screen; }
.dh__glows i { position: absolute; width: var(--g); aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; opacity: 0.35;
  background: radial-gradient(closest-side, rgba(255, 196, 120, 0.7), rgba(255, 150, 70, 0.25) 45%, transparent);
  animation: dh-breathe var(--gd) ease-in-out var(--gl) infinite alternate; animation-play-state: paused; }
.dh.is-live .dh__glows i { animation-play-state: running; }
@keyframes dh-breathe { from { opacity: 0.25; transform: scale(0.88); } to { opacity: 0.7; transform: scale(1.08); } }

/* Rose petals drifting down (the regular Hero's fall, in the festival's red). */
.dh__petals { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.dh__petals span {
  position: absolute; top: -40px; left: var(--x); width: var(--s); aspect-ratio: 1.55; border-radius: 85% 6% 85% 6%; opacity: 0;
  background: radial-gradient(ellipse at 30% 35%, #f0627a, #c4173c 58%, #7d0c25);
  box-shadow: inset -2px -3px 6px rgba(60, 0, 10, 0.35);
  animation: hx-fall var(--d) linear var(--del) infinite; animation-play-state: paused; will-change: transform, opacity;
}
.dh.is-live .dh__petals span { animation-play-state: running; }

/* ── The words: one block in em of --dh-fs, which the script fits to the photograph ──── */
.dh__text {
  position: absolute; z-index: 3; font-size: var(--dh-fs, 16px); display: grid; justify-items: center; text-align: center;
  text-shadow: 0 2px 18px rgba(var(--dh-night), 0.55);
}
.dh--wide .dh__text { left: clamp(32px, 6.5vw, 150px); top: var(--hx-hdr); bottom: 0; width: 26em; max-width: 42vw; align-content: center; padding-block: 2.2em 1.6em; }
.dh--tall .dh__text { left: clamp(14px, 4.6vw, 64px); top: max(calc(var(--hx-hdr) + 14px), 9%); width: 19em; max-width: 64%; }
.dh__crest { display: flex; align-items: center; gap: 0.6em; color: var(--dh-gold); }
.dh__crest i, .dh__rule i { display: block; width: 3.2em; height: 1px; background: linear-gradient(90deg, transparent, var(--dh-gold)); }
.dh__crest i:last-child, .dh__rule i:last-child { background: linear-gradient(90deg, var(--dh-gold), transparent); }
.dh__crest-ic { width: 2.6em; height: auto; }
.dh__eyebrow { margin-top: 0.7em; font-family: var(--ui-font-display); font-weight: 400; font-size: max(0.78em, 10px); letter-spacing: 0.34em; padding-left: 0.34em; text-transform: uppercase; color: var(--dh-cream); }
.dh__rule { display: flex; align-items: center; gap: 0.5em; color: var(--dh-gold); margin-top: 0.55em; }
.dh__diamond { width: 1.5em; height: auto; }
.dh__title { margin: 0.35em 0 0; font-size: 1em; display: grid; justify-items: center; font-family: var(--hx-serif); font-weight: 400; color: var(--dh-cream); line-height: 1; letter-spacing: -0.005em; }
.dh__pre { font-size: 2.55em; line-height: 1.05; }
.dh__big { font-size: 4.6em; line-height: 0.98; font-weight: 500; background: linear-gradient(180deg, #fbefd6 20%, var(--dh-cream) 55%, #e2c58d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dh__sub { margin-top: 0.12em; font-size: 2.25em; font-style: italic; line-height: 1.15; color: var(--dh-cream-soft); }
.dh__title .dh__big { text-shadow: none; filter: drop-shadow(0 3px 14px rgba(var(--dh-night), 0.5)); }
.dh__rule-ic { width: 1.9em; height: auto; }
.dh__text > .dh__rule:nth-of-type(2) { margin-top: 0.7em; }
.dh__line { margin: 0.8em 0 0; max-width: 17em; font-family: var(--hx-serif); font-size: max(1.12em, 13px); line-height: 1.45; color: var(--dh-cream); text-wrap: balance; }

/* The button: the tenant plum framed in lamp gold; a sheen crosses it on hover. */
.dh__cta {
  position: relative; overflow: hidden; margin-top: 1.5em; display: inline-flex; align-items: center; gap: 0.9em; min-height: 44px;
  padding: 1.05em 1.7em; border: 1px solid var(--dh-gold); border-radius: 3px; background: var(--ui-accent); color: var(--dh-cream);
  font-family: var(--ui-font-display); font-size: max(0.8em, 11px); font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; text-shadow: none; white-space: nowrap;
  box-shadow: 0 10px 28px -10px rgba(0, 0, 0, 0.6), inset 0 0 0 1px rgba(255, 220, 160, 0.12);
  transition: border-color var(--ui-dur-base) var(--ui-ease), box-shadow var(--ui-dur-slow) var(--ui-ease), transform var(--ui-dur-fast) var(--ui-ease);
}
.dh__cta::before { content: ''; position: absolute; inset: 0; translate: -120% 0; background: linear-gradient(100deg, transparent 30%, rgba(255, 228, 180, 0.28) 50%, transparent 70%); transition: translate 900ms var(--hm-ease-out); }
.dh__cta-ic { width: 1.6em; height: auto; transition: transform var(--ui-dur-slow) var(--hm-ease-out); }
.dh__cta:hover { border-color: #f1d08f; box-shadow: 0 14px 34px -10px rgba(0, 0, 0, 0.7), 0 0 0 4px rgba(214, 176, 106, 0.18); }
.dh__cta:hover::before { translate: 120% 0; }
.dh__cta:hover .dh__cta-ic { transform: translateX(5px); }
.dh__cta:active { transform: scale(0.98); }
.dh__cta:focus-visible { outline: 2px solid #f1d08f; outline-offset: 4px; }
@media (max-width: 599px) { .dh__cta { letter-spacing: 0.1em; padding: 0.95em 1.15em; gap: 0.6em; } }

/* Features: three gold line icons, each a way in. */
.dh__feats { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dh__feats li { display: flex; justify-content: center; }
.dh__feats li + li { border-left: 1px solid color-mix(in srgb, var(--dh-gold) 55%, transparent); }
.dh__feat { display: grid; justify-items: center; gap: 0.55em; min-height: 44px; padding: 0.3em 0.6em; color: var(--dh-cream); text-decoration: none; text-align: center; }
.dh__feat-ic { width: 2.5em; height: auto; color: var(--dh-gold); transition: transform var(--ui-dur-slow) var(--ui-ease-spring), color var(--ui-dur-base) var(--ui-ease); }
.dh__feat span { font-family: var(--ui-font-display); font-size: max(0.66em, 10px); font-weight: 600; letter-spacing: 0.16em; line-height: 1.45; text-transform: uppercase; max-width: 9em; background: linear-gradient(currentColor, currentColor) 50% 100% / 0 1px no-repeat; transition: background-size var(--ui-dur-slow) var(--ui-ease); }
.dh__feat:hover .dh__feat-ic { transform: translateY(-3px); color: #f1d08f; }
.dh__feat:hover span { background-size: 100% 1px; }
.dh__feat:focus-visible { outline: 2px solid #f1d08f; outline-offset: 2px; border-radius: 4px; }
.dh--wide .dh__feats { margin-top: 2.2em; width: 100%; font-size: 1em; }
.dh--below .dh__feats { position: relative; font-size: clamp(12px, 3.6vw, 16px); padding: 18px clamp(10px, 4vw, 48px) 20px; }
.dh--below { background: linear-gradient(180deg, #2a0a0e, #1d0709); }
.dh--wide.dh--below .dh__feats { margin: 0 auto; width: auto; max-width: 640px; }
.dh--tall.dh--below .dh__feats { position: relative; padding: 18px clamp(10px, 4vw, 48px) 20px; background: linear-gradient(180deg, #2a0a0e, #1d0709); }
.dh--tall:not(.dh--below) .dh__feats { position: absolute; z-index: 3; left: 0; right: 0; bottom: 0; padding: 0 clamp(10px, 4vw, 48px) max(18px, 3.2svh); }
.dh--tall .dh__feats { font-size: clamp(12px, 3.6vw, 18px); text-shadow: 0 2px 12px rgba(var(--dh-night), 0.6); }

/* Entrance: the photograph settles, the words rise in order, the features last. */
.dh__crest, .dh__eyebrow, .dh__rule, .dh__pre, .dh__big, .dh__sub, .dh__line, .dh__cta, .dh__feats li { animation: hm-rise 900ms var(--hm-ease-out) both; }
.dh__eyebrow { animation-delay: 120ms; } .dh__text > .dh__rule:first-of-type { animation-delay: 200ms; }
.dh__pre { animation-delay: 260ms; } .dh__big { animation-delay: 360ms; } .dh__sub { animation-delay: 520ms; }
.dh__text > .dh__rule:nth-of-type(2) { animation-delay: 680ms; } .dh__line { animation-delay: 780ms; } .dh__cta { animation-delay: 900ms; }
.dh__feats li:nth-child(1) { animation-delay: 1050ms; } .dh__feats li:nth-child(2) { animation-delay: 1150ms; } .dh__feats li:nth-child(3) { animation-delay: 1250ms; }

@media (prefers-reduced-motion: reduce) {
  .dh__media > .ph-img, .dh__crest, .dh__eyebrow, .dh__rule, .dh__pre, .dh__big, .dh__sub, .dh__line, .dh__cta, .dh__feats li { animation: none; }
  .dh__petals { display: none; }
  .dh__glows i { animation: none; opacity: 0.45; }
  .dh__cta, .dh__cta::before, .dh__cta-ic, .dh__feat-ic, .dh__feat span { transition: none; }
}

/* ── Slot 2 · Navaratri Colour Story ────────────────────────────────────────────────
   The Hero's evening continues (owner's dark reference, 8 Oct 2026): the lamp-lit hall, blurred
   and dimmed, behind cream words; nine arched cards whose photographs melt into their night's
   colour, framed in gold; diya glow and petals at the foot. */
.nc {
  --nc-wine: var(--ui-accent); --nc-gold: #d6b06a; --nc-cream: #f3e3c3;
  position: relative; isolation: isolate; overflow: hidden; color: var(--nc-cream); background: #1d0709;
  padding-block: clamp(56px, 7vw, 104px) clamp(56px, 6vw, 96px);
}
.nc__defs { position: absolute; width: 0; height: 0; }
.nc__haze { position: absolute; z-index: -3; inset: -60px; background-size: cover; background-position: 50% 30%;
  filter: blur(16px) brightness(0.62) saturate(1.1); opacity: 0.95; }
/* The section's own lamp-lit hall (owner's backgrounds: desktop, portrait tablet, phone). */
.nc__bg { position: absolute; z-index: -3; inset: 0; }
.nc__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.nc::before { content: ''; position: absolute; z-index: -2; inset: 0; pointer-events: none; background:
  linear-gradient(180deg, #1d0709 0, rgba(29, 7, 9, 0) 90px),
  radial-gradient(70% 55% at 50% 22%, rgba(29, 7, 9, 0.62), rgba(29, 7, 9, 0) 72%),
  linear-gradient(180deg, rgba(29, 7, 9, 0) 40%, rgba(29, 7, 9, 0.35) 70%),
  linear-gradient(0deg, rgba(29, 7, 9, 0.65) 0, rgba(29, 7, 9, 0) 30%); }
.nc__flora { position: absolute; z-index: -1; width: clamp(120px, 13vw, 220px); height: auto; color: var(--nc-gold); opacity: 0.16; }
.nc__flora--l { left: -2%; top: 40%; rotate: -12deg; }
.nc__flora--r { right: -2%; top: 14%; rotate: 10deg; }
.nc__glow { position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; height: 120px; pointer-events: none;
  background: radial-gradient(60px 42px at 5% 92%, rgba(255, 186, 102, 0.6), transparent), radial-gradient(70px 46px at 16% 100%, rgba(255, 170, 90, 0.45), transparent),
    radial-gradient(56px 38px at 48% 104%, rgba(255, 186, 102, 0.35), transparent),
    radial-gradient(64px 42px at 84% 96%, rgba(255, 186, 102, 0.55), transparent), radial-gradient(80px 48px at 96% 90%, rgba(255, 170, 90, 0.5), transparent);
  animation: nc-glow 4.6s ease-in-out infinite alternate; animation-play-state: paused; }
.nc.is-live .nc__glow { animation-play-state: running; }
@keyframes nc-glow { from { opacity: 0.6; } to { opacity: 1; } }
.nc__petals { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.nc__petals span { position: absolute; top: -40px; left: var(--x); width: var(--s); aspect-ratio: 1.55; border-radius: 85% 6% 85% 6%; opacity: 0;
  background: radial-gradient(ellipse at 30% 35%, #f0627a, #c4173c 58%, #7d0c25); animation: hx-fall var(--d) linear var(--del) infinite; animation-play-state: paused; }
.nc.is-live .nc__petals span { animation-play-state: running; }
.nc__in { position: relative; max-width: 1720px; margin-inline: auto; padding-inline: clamp(12px, 2vw, 32px); }

/* Heading, cream on the evening */
.nc__head { display: grid; justify-items: center; text-align: center; gap: 10px; margin-bottom: clamp(28px, 3.6vw, 52px); text-shadow: 0 2px 16px rgba(29, 7, 9, 0.6); }
.nc__crest, .nc__rule { display: flex; align-items: center; gap: 12px; color: var(--nc-gold); }
.nc__crest i, .nc__rule i { display: block; width: clamp(48px, 9vw, 150px); height: 1px; background: linear-gradient(90deg, transparent, var(--nc-gold)); }
.nc__crest i:last-child, .nc__rule i:last-child { background: linear-gradient(90deg, var(--nc-gold), transparent); }
.nc__crest-ic { width: 42px; height: auto; aspect-ratio: 48 / 40; }
.nc__rule .dh__diamond { width: 26px; }
.nc__title { margin: 4px 0 0; font-family: var(--hx-serif); font-weight: 400; font-size: clamp(2.3rem, 5vw, 4.4rem); line-height: 1.04; color: transparent; text-wrap: balance;
  background: linear-gradient(180deg, #fbefd6 20%, var(--nc-cream) 55%, #e2c58d); -webkit-background-clip: text; background-clip: text; text-shadow: none; filter: drop-shadow(0 3px 14px rgba(29, 7, 9, 0.5)); }
.nc__line { margin: 2px 0 0; font-family: var(--ui-font-display); font-size: clamp(0.72rem, 1.05vw, 0.95rem); letter-spacing: 0.32em; padding-left: 0.32em; text-transform: uppercase; color: var(--nc-cream); text-wrap: balance; }
.nc__intro { margin: 6px 0 0; max-width: 48ch; font-family: var(--hx-serif); font-size: clamp(1rem, 1.2vw, 1.12rem); line-height: 1.55; color: #ead8b6; text-wrap: balance; }
.nc__when { margin: 2px 0 0; font-family: var(--hx-serif); font-style: italic; color: var(--nc-gold); }

/* Cards: the whole card is an arch; the photograph fills it and melts into the colour below;
   a fine inner arch frames the words; a gold rim runs round the outside. */
.nc__rowwrap { position: relative; }
.nc__row { list-style: none; margin: 0; padding: 22px 0 8px; display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: clamp(8px, 0.9vw, 16px); }
.nc__item { min-width: 0; }
.nc.is-in .nc__item { animation: hm-rise 800ms var(--hm-ease-out) both; animation-delay: calc(var(--i) * 80ms); }
@media (prefers-reduced-motion: no-preference) { .nc:not(.is-in) .nc__item { opacity: 0; } }
.nc__card { position: relative; display: block; aspect-ratio: 0.38; text-decoration: none; color: inherit;
  filter: drop-shadow(0 16px 22px rgba(0, 0, 0, 0.45)); transition: transform 600ms var(--hm-ease-out), filter 600ms var(--hm-ease-out); }
.nc__frame { position: absolute; inset: 0; clip-path: url(#nc-arch); background: var(--c); overflow: hidden; }
.nc__photo { position: absolute; left: 0; right: 0; top: 0; height: 80%; }
.nc__photo .ph-img { object-position: 50% 18%; transition: transform 1100ms var(--hm-ease-out); }
.nc__ph { background: linear-gradient(170deg, color-mix(in srgb, var(--c) 40%, #2a0e10), color-mix(in srgb, var(--c) 70%, #1d0709)); }
.nc__ph .ph__art { inset: 12% 16% 34%; }
.nc__panel { position: absolute; left: 0; right: 0; bottom: 0; height: 50%; padding: 22% 9% 10%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 3px; text-align: center;
  background: linear-gradient(180deg, color-mix(in srgb, var(--c) 0%, transparent) 0%, color-mix(in srgb, var(--c) 78%, transparent) 22%, var(--c) 40%, color-mix(in srgb, var(--c) 80%, black) 100%); }
.nc__inner { position: absolute; left: 0; right: 0; top: 8%; bottom: 3%; width: 100%; height: 89%; overflow: visible; pointer-events: none; }
.nc__inner path { fill: none; stroke: currentColor; stroke-width: 1; vector-effect: non-scaling-stroke; opacity: 0.45; }
.nc__card--cream .nc__panel { color: var(--nc-cream); }
.nc__card--plum .nc__panel { color: var(--nc-wine); background: linear-gradient(180deg, color-mix(in srgb, var(--c) 0%, transparent) 0%, color-mix(in srgb, var(--c) 78%, transparent) 22%, var(--c) 40%, color-mix(in srgb, var(--c) 94%, black) 100%); }
.nc__panel-ic { flex: none; width: 28%; max-width: 34px; height: auto; aspect-ratio: 48 / 40; opacity: 0.95; }
.nc__day { margin-top: 6px; font-family: var(--hx-serif); font-style: italic; font-size: clamp(0.78rem, 0.9vw, 0.95rem); }
.nc__date { font-style: normal; opacity: 0.85; }
.nc__name { font-family: var(--hx-serif); font-size: clamp(0.9rem, 1.15vw, 1.3rem); line-height: 1.15; letter-spacing: 0.04em; text-transform: uppercase; text-wrap: balance; }
.nc__meaning { margin-top: 2px; font-family: var(--hx-serif); font-size: clamp(0.72rem, 0.82vw, 0.9rem); line-height: 1.35; text-wrap: balance; }
.nc__go { flex: none; margin-top: 10px; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; border: 1px solid currentColor; opacity: 0.9;
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), transform var(--ui-dur-slow) var(--hm-ease-out); }
.nc__go svg { width: 18px; height: 18px; }
.nc__rim { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.nc__rim path { fill: none; stroke: #c9a45f; stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.nc__card:hover { transform: translateY(-6px); filter: drop-shadow(0 0 14px rgba(255, 196, 120, 0.3)) drop-shadow(0 22px 26px rgba(0, 0, 0, 0.5)); }
.nc__card:hover .ph-img { transform: scale(1.05); }
.nc__card:hover .nc__go { background: #d6b06a; border-color: #d6b06a; color: #3b0b1d; transform: translateX(2px); }
.nc__card:focus-visible { outline: 0; }
.nc__card:focus-visible .nc__rim path { stroke: #f1d08f; stroke-width: 3; }
/* Today: a gold tag on the arch, the card lifted and lit. */
.nc__today { position: absolute; left: 50%; top: 3.5%; translate: -50% 0; padding: 4px 12px 3px; border-radius: 999px; background: linear-gradient(180deg, #f1d08f, #c9a45f); color: #3b0b1d;
  font-family: var(--ui-font-display); font-size: 0.66rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4); }
.nc__item.is-today .nc__card { transform: translateY(-10px); filter: drop-shadow(0 0 18px rgba(255, 196, 120, 0.55)) drop-shadow(0 22px 26px rgba(0, 0, 0, 0.5)); }
.nc__item.is-today .nc__rim path { stroke: #f1d08f; stroke-width: 2.4; }
.nc.is-live .nc__item.is-today .nc__card { animation: nc-breathe 3.6s ease-in-out infinite alternate; }
/* Today's breathing glow on the compositor (scroll performance, 9 Oct 2026): the card keeps only its
   dark shadow, and two arch-shaped soft layers behind it cross-fade between the glow's two ends
   (10px at 0.35, 26px at 0.8). Reduced motion keeps the card's static glow above, unchanged. */
.nc__halo { position: absolute; left: 0; right: 0; top: 0; aspect-ratio: 0.38; transform: translateY(-10px); visibility: hidden; pointer-events: none; }
.nc__halo svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: rgb(255, 196, 120); }
.nc__halo-d { fill: #000; filter: blur(13px); opacity: 0.5; transform: translateY(22px); } /* the card's dark shadow, beneath the glow as before */
.nc__halo-a { filter: blur(5px) drop-shadow(0 22px 26px rgba(0, 0, 0, 0.5)); opacity: 0.35; }
.nc__halo-b { filter: blur(13px) drop-shadow(0 22px 26px rgba(0, 0, 0, 0.5)); opacity: 0; } /* static filters; only opacity animates */
@media (prefers-reduced-motion: no-preference) {
  .nc__item.is-today { position: relative; }
  .nc.is-live .nc__item.is-today .nc__card { animation: none; filter: none; }
  .nc.is-live .nc__item.is-today .nc__halo { visibility: visible; }
  .nc.is-live .nc__item.is-today .nc__halo-a { animation: nc-halo-a 3.6s ease-in-out infinite alternate; }
  .nc.is-live .nc__item.is-today .nc__halo-b { animation: nc-halo-b 3.6s ease-in-out infinite alternate; }
}
@keyframes nc-halo-a { from { opacity: 0.35; } to { opacity: 0; } }
@keyframes nc-halo-b { from { opacity: 0; } to { opacity: 0.8; } }
@keyframes nc-breathe { from { filter: drop-shadow(0 0 10px rgba(255, 196, 120, 0.35)) drop-shadow(0 22px 26px rgba(0, 0, 0, 0.5)); } to { filter: drop-shadow(0 0 26px rgba(255, 196, 120, 0.8)) drop-shadow(0 22px 26px rgba(0, 0, 0, 0.5)); } }

/* Arrows (swiping widths only) */
.nc__arrow { position: absolute; z-index: 2; top: 50%; translate: 0 -50%; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
  background: rgba(29, 7, 9, 0.72); color: var(--nc-cream); border: 1px solid color-mix(in srgb, var(--nc-gold) 75%, transparent); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4);
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), opacity var(--ui-dur-base) var(--ui-ease); }
.nc__arrow svg { width: 20px; height: 20px; }
.nc__arrow[hidden] { display: none; }
.nc__arrow--prev { left: 4px; } .nc__arrow--next { right: 4px; }
.nc__arrow:hover:not(:disabled) { background: var(--nc-gold); color: #3b0b1d; }
.nc__arrow:disabled { opacity: 0; pointer-events: none; }
.nc__arrow:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }

/* Foot line: today's colour (or the opening night, or Dussehra) and where it leads. */
.nc__foot { margin: clamp(22px, 2.6vw, 36px) auto 0; max-width: 62ch; text-align: center; font-family: var(--hx-serif); font-size: clamp(1rem, 1.2vw, 1.12rem); line-height: 1.55; color: var(--nc-cream); text-wrap: balance; }
.nc__foot-k { display: block; font-family: var(--ui-font-display); font-size: 0.72rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--nc-gold); margin-bottom: 2px; }
.nc__foot b { color: #fbefd6; font-weight: 600; }
.nc__foot-a { display: inline-flex; align-items: center; min-height: 44px; margin-left: 6px; color: var(--nc-gold); font-weight: 600; text-underline-offset: 4px; text-decoration-color: color-mix(in srgb, var(--nc-gold) 70%, transparent); }
.nc__foot-a:hover { color: #f1d08f; text-decoration-color: #f1d08f; }

/* 1100–1359: the row swipes, about six cards at a time. Tablets: about three and a half. */
@media (max-width: 1359px) and (min-width: 600px) {
  .nc__row { display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-inline: 4px; scroll-padding-inline: 4px; }
  .nc__row::-webkit-scrollbar { display: none; }
  .nc__item { flex: 0 0 calc((100% - 5 * 14px) / 6); scroll-snap-align: center; }
}
@media (max-width: 1099px) and (min-width: 600px) { .nc__item { flex-basis: calc((100% - 3 * 14px) / 3.5); } }
.nc__swatch, .nc__br { display: none; }

/* Phones: the approved 3 × 3 grid, set as an editorial plate rather than a catalogue grid.
   Generous gutters; the portrait fills each arch and the night's colour rises as a veil from its
   foot; the colour name leads, the day sits above it as a gold small-cap label and the date below
   in italic; the middle column is set a step lower so each row reads as a gentle arc; a fine gold
   rim, no icons. Today's colour reads as a caption under the plate. Desktop and tablet unchanged. */
@media (max-width: 599px) {
  .nc { padding-block: 64px 56px; }
  .nc__in { padding-inline: 18px; }
  .nc__head { gap: 12px; margin-bottom: 30px; }
  .nc__crest-ic { width: 32px; }
  .nc__crest i, .nc__rule i { width: 56px; }
  .nc__title { font-size: clamp(2.35rem, 11.4vw, 3.1rem); line-height: 1.06; }
  .nc__line { font-size: 0.68rem; letter-spacing: 0.3em; padding-left: 0.3em; line-height: 1.9; }
  .nc__br { display: inline; }
  .nc__intro { font-size: 0.98rem; max-width: 30ch; color: #e6d2ae; }
  .nc__flora--r { display: none; }

  .nc__row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 11px; padding: 6px 0 22px; }
  .nc__item:nth-child(3n + 2) { translate: 0 22px; }
  .nc__card { aspect-ratio: 0.5; filter: drop-shadow(0 10px 16px rgba(0, 0, 0, 0.5)); }
  .nc__card:hover { transform: none; }
  .nc__photo { height: 100%; }
  .nc__photo .ph-img { object-position: 50% 16%; }
  .nc__inner, .nc__panel-ic, .nc__meaning, .nc__go, .nc__sep { display: none; }
  /* The colour as a veil: clear over the face, deepening to the night's colour at the foot. */
  .nc__panel { height: 52%; padding: 0 6% 13%; gap: 0; justify-content: flex-end;
    background: linear-gradient(180deg, color-mix(in srgb, var(--c) 0%, transparent) 0%, color-mix(in srgb, var(--c) 55%, transparent) 30%, color-mix(in srgb, var(--c) 92%, transparent) 55%, var(--c) 72%, color-mix(in srgb, var(--c) 86%, black) 100%); }
  .nc__card--plum .nc__panel { background: linear-gradient(180deg, color-mix(in srgb, var(--c) 0%, transparent) 0%, color-mix(in srgb, var(--c) 55%, transparent) 30%, color-mix(in srgb, var(--c) 92%, transparent) 55%, var(--c) 72%, color-mix(in srgb, var(--c) 96%, black) 100%); }
  .nc__day { display: contents; }
  .nc__dn { order: 1; font-family: var(--ui-font-display); font-style: normal; font-size: 0.62rem; font-weight: 600; letter-spacing: 0.24em; padding-left: 0.24em; text-transform: uppercase; opacity: 0.9; }
  .nc__dn::after { content: ''; display: block; width: 18px; height: 1px; margin: 5px auto 4px; background: currentColor; opacity: 0.6; }
  .nc__name { order: 2; font-size: clamp(0.84rem, 3.9vw, 0.98rem); line-height: 1.12; letter-spacing: 0.01em; text-transform: none; font-weight: 500; }
  .nc__date { order: 3; display: block; margin-top: 3px; font-family: var(--hx-serif); font-style: italic; font-size: 0.7rem; opacity: 0.85; }
  .nc__card--cream .nc__dn { color: #ecd09a; }
  /* A finer rim, gold catching light at the crown. */
  .nc__rim path { stroke: url(#nc-rim-g); stroke-width: 1; }
  .nc__today { top: -9px; padding: 3px 9px 2px; font-size: 0.55rem; letter-spacing: 0.16em; }
  .nc__item.is-today .nc__card { transform: translateY(-6px); }
  .nc__halo { aspect-ratio: 0.5; transform: translateY(-6px); }
  .nc__item.is-today .nc__rim path { stroke: #f1d08f; stroke-width: 1.6; }

  /* Today's colour as an editorial caption beneath the plate. */
  .nc__foot { margin-top: 30px; padding: 20px 8px 0; max-width: 34ch; font-size: 1rem; line-height: 1.6; border-top: 1px solid rgba(214, 176, 106, 0.35); }
  .nc__foot-k { font-size: 0.64rem; letter-spacing: 0.28em; margin-bottom: 10px; }
  .nc__swatch { display: inline-block; width: 12px; height: 12px; margin-right: 8px; vertical-align: -1px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px #1d0709, 0 0 0 2.5px #d6b06a; }
  .nc__foot b { font-family: var(--hx-serif); font-size: 1.22rem; font-weight: 500; letter-spacing: 0.01em; }
  .nc__foot-a { display: flex; justify-content: center; width: fit-content; margin: 14px auto 0; padding: 0 20px; border: 1px solid rgba(214, 176, 106, 0.7); border-radius: 999px;
    font-family: var(--ui-font-display); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; color: #f1d08f; }
  .nc__foot-a:hover { background: rgba(214, 176, 106, 0.14); }
}
@media (max-width: 359px) { .nc__row { gap: 22px 8px; } .nc__in { padding-inline: 14px; } .nc__dn { font-size: 0.6rem; letter-spacing: 0.16em; padding-left: 0.16em; } .nc__name { font-size: 0.8rem; } }

@media (prefers-reduced-motion: reduce) {
  .nc.is-in .nc__item, .nc.is-live .nc__item.is-today .nc__card, .nc__glow { animation: none; }
  .nc__petals { display: none; }
  .nc__card, .nc__photo .ph-img, .nc__go, .nc__arrow { transition: none; }
}
.nc__foot-ar { margin-left: 0.4em; transition: transform var(--ui-dur-slow) var(--hm-ease-out); }
.nc__foot-a:hover .nc__foot-ar { transform: translateX(4px); }

/* ── Slot 3 · The Edit (Dussehra Festive Edit) ──────────────────────────────────────
   The evening's last dark band (photograph left, words right; stacked on tablets and phones),
   then the page turns to the tenant's ivory: the nine handpicked sarees, then four tiles. */
.ed { --ed-cream: #f3e3c3; --ed-gold: #d6b06a; --nc-gold: #d6b06a; --ed-ivory: #f8efe2; position: relative; isolation: isolate; background: #1d0709; }
.ed__band { position: relative; overflow: hidden; color: var(--ed-cream); }
.ed__media { display: block; position: relative; }
.ed__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ed__shade { position: absolute; inset: 0; pointer-events: none; }
.ed__text { position: relative; z-index: 2; display: grid; justify-items: center; text-align: center; gap: 10px; text-shadow: 0 2px 16px rgba(29, 7, 9, 0.6); }
.ed__crest { margin-bottom: 2px; }
.ed__kicker { font-family: var(--hx-serif); font-style: italic; font-size: clamp(1.35rem, 2.1vw, 2.3rem); line-height: 1.1; color: var(--ed-cream); }
.ed__title { margin: 0; font-family: var(--hx-serif); font-weight: 400; font-size: clamp(2.5rem, 4.4vw, 5rem); line-height: 1.02; letter-spacing: -0.005em; text-wrap: balance; color: transparent;
  background: linear-gradient(180deg, #fbefd6 20%, var(--ed-cream) 55%, #e2c58d); -webkit-background-clip: text; background-clip: text; text-shadow: none; filter: drop-shadow(0 3px 14px rgba(29, 7, 9, 0.5)); }
.ed__line { margin: 4px 0 0; font-family: var(--ui-font-display); font-size: clamp(0.72rem, 1vw, 0.95rem); letter-spacing: 0.32em; padding-left: 0.32em; text-transform: uppercase; color: var(--ed-cream); text-wrap: balance; }
.ed__rule-ic { width: 30px; height: auto; aspect-ratio: 48 / 40; }
.ed__intro { margin: 4px 0 0; max-width: 46ch; font-family: var(--hx-serif); font-size: clamp(1rem, 1.2vw, 1.15rem); line-height: 1.55; color: #ead8b6; text-wrap: balance; }
.ed__cta { margin-top: 14px; display: inline-flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 22px 0 32px; border-radius: 999px; text-decoration: none; text-shadow: none;
  background: linear-gradient(180deg, #fbf3e3, #f1e2c6); color: #3b0b1d; font-family: var(--ui-font-display); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
  box-shadow: 0 10px 26px -10px rgba(0, 0, 0, 0.6), inset 0 0 0 1px rgba(162, 123, 60, 0.35);
  transition: box-shadow var(--ui-dur-slow) var(--ui-ease), transform var(--ui-dur-fast) var(--ui-ease); }
.ed__cta svg { width: 18px; height: 18px; transition: transform var(--ui-dur-slow) var(--hm-ease-out); }
.ed__cta:hover { box-shadow: 0 14px 32px -10px rgba(0, 0, 0, 0.7), 0 0 0 4px rgba(214, 176, 106, 0.25), inset 0 0 0 1px rgba(162, 123, 60, 0.5); }
.ed__cta:hover svg { transform: translateX(4px); }
.ed__cta:active { transform: scale(0.98); }
.ed__cta:focus-visible { outline: 2px solid #f1d08f; outline-offset: 4px; }

/* Stacked (tablets and phones): the photograph above, fading into the dark under the words. */
.ed__media { aspect-ratio: 4 / 5; max-height: 860px; width: 100%; }
.ed__media img { object-position: 40% 18%; }
.ed__shade { display: none; }
.ed__media::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; pointer-events: none; background: linear-gradient(180deg, rgba(29, 7, 9, 0), rgba(29, 7, 9, 0.7) 55%, #1d0709); }
.ed__text { margin-top: -70px; padding: 0 20px 52px; }
@media (min-width: 600px) { .ed__media { aspect-ratio: 3 / 3.4; } .ed__text { margin-top: -110px; padding-bottom: 64px; } }
/* Wide and landscape: the words over the dark right side of the photograph. */
@media (min-width: 1100px), (min-width: 860px) and (orientation: landscape) {
  .ed__band { height: clamp(540px, 44vw, 780px); }
  .ed__media { position: absolute; inset: 0; aspect-ratio: auto; max-height: none; height: 100%; }
  .ed__media::after { display: none; }
  .ed__shade { display: block; }
  .ed__media img { object-position: 30% 12%; }
  .ed__shade { background: linear-gradient(270deg, rgba(29, 7, 9, 0.82) 0%, rgba(29, 7, 9, 0.62) 30%, rgba(29, 7, 9, 0.2) 50%, rgba(29, 7, 9, 0) 62%),
    linear-gradient(0deg, rgba(29, 7, 9, 0.45) 0%, rgba(29, 7, 9, 0) 22%); }
  .ed__text { position: absolute; top: 0; bottom: 0; right: clamp(24px, 5vw, 110px); width: min(46%, 700px); margin: 0; padding: 0; align-content: center; }
}

/* The turn to ivory */
.ed__ivory { position: relative; background: linear-gradient(180deg, #ecdcc4 0, var(--ed-ivory) 90px); padding-block: clamp(44px, 5vw, 72px) clamp(56px, 6vw, 96px); color: var(--ui-text); }
.ed__ivory::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, #c9a45f 20%, #f1d08f 50%, #c9a45f 80%, transparent); }
.ed__picks, .ed__tiles { max-width: 1440px; margin-inline: auto; padding-inline: var(--hm-gutter); }

/* The nine: the approved product card in a swiping row. */
.ed__picks-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.ed__picks-t { margin: 0; font-family: var(--hx-serif); font-weight: 400; font-style: italic; font-size: clamp(1.5rem, 2.2vw, 2.1rem); color: var(--ui-accent); }
.ed__arrows { display: flex; gap: 10px; }
.ed__arrow { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; background: transparent; color: var(--ui-accent); border: 1px solid color-mix(in srgb, #a27b3c 70%, transparent);
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), opacity var(--ui-dur-base) var(--ui-ease); }
.ed__arrow svg { width: 20px; height: 20px; }
.ed__arrow[hidden] { display: none; }
.ed__arrow:hover:not(:disabled) { background: var(--ui-accent); color: var(--ui-accent-fg); border-color: var(--ui-accent); }
.ed__arrow:disabled { opacity: 0.35; cursor: default; }
.ed__arrow:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }
.ed__rail { display: grid; grid-auto-flow: column; gap: 24px; grid-auto-columns: calc((100% - 4 * 24px) / 5); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; padding: 4px 2px 12px; }
.ed__rail::-webkit-scrollbar { display: none; }
.ed__rail:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 4px; }
.ed__pick { scroll-snap-align: start; min-width: 0; }

/* Tiles: the silk on the left, the words on the right, in a fine double gold frame. */
.ed__tiles { list-style: none; margin-top: clamp(40px, 4.4vw, 64px); margin-bottom: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.ed__tile { position: relative; height: 100%; display: grid; grid-template-columns: 47% 1fr; gap: 0; padding: 8px; text-decoration: none; color: var(--ui-text); background: #fffaf3;
  border: 1px solid color-mix(in srgb, #a27b3c 50%, transparent); box-shadow: inset 0 0 0 4px #fffaf3, inset 0 0 0 5px color-mix(in srgb, #a27b3c 28%, transparent), 0 10px 24px -16px rgba(60, 20, 10, 0.4);
  transition: box-shadow var(--ui-dur-slow) var(--ui-ease), transform 600ms var(--hm-ease-out); }
.ed__tile-img { position: relative; overflow: hidden; min-height: clamp(210px, 17vw, 270px); border-radius: 2px; background: #2a0e10; }
.ed__tile-img .ph-img { transition: transform 1100ms var(--hm-ease-out); }
.ed__tile-body { display: flex; flex-direction: column; align-items: flex-start; padding: 14px 8px 8px 18px; min-width: 0; }
.ed__tile-ic { width: 30px; height: auto; aspect-ratio: 48 / 40; color: #a27b3c; }
.ed__tile-t { margin-top: 12px; font-family: var(--hx-serif); font-size: clamp(1.2rem, 1.45vw, 1.55rem); line-height: 1.12; color: var(--ui-accent); text-wrap: balance; }
.ed__tile-l { margin-top: 8px; font-family: var(--hx-serif); font-size: 0.92rem; line-height: 1.45; color: color-mix(in srgb, var(--ui-text) 85%, var(--ui-accent)); }
.ed__tile-go { margin-top: auto; padding-top: 12px; }
.ed__tile-go svg { width: 38px; height: 38px; padding: 9px; border-radius: 50%; border: 1px solid currentColor; color: var(--ui-accent);
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), transform var(--ui-dur-slow) var(--hm-ease-out); }
.ed__tile:hover { transform: translateY(-4px); box-shadow: inset 0 0 0 4px #fffaf3, inset 0 0 0 5px color-mix(in srgb, #a27b3c 45%, transparent), 0 18px 32px -16px rgba(60, 20, 10, 0.5); }
.ed__tile:hover .ph-img { transform: scale(1.05); }
.ed__tile:hover .ed__tile-go svg { background: #d6b06a; border-color: #d6b06a; color: #3b0b1d; transform: translateX(2px); }
.ed__tile:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }

/* Entrance: the band's words rise in order; the tiles one after another. */
@media (prefers-reduced-motion: no-preference) {
  .ed__band:not(.is-in) .ed__text > * { opacity: 0; }
  .ed__band.is-in .ed__text > * { animation: hm-rise 850ms var(--hm-ease-out) both; }
  .ed__band.is-in .ed__text > :nth-child(2) { animation-delay: 100ms; } .ed__band.is-in .ed__text > :nth-child(3) { animation-delay: 200ms; }
  .ed__band.is-in .ed__text > :nth-child(4) { animation-delay: 320ms; } .ed__band.is-in .ed__text > :nth-child(5) { animation-delay: 420ms; }
  .ed__band.is-in .ed__text > :nth-child(6) { animation-delay: 520ms; } .ed__band.is-in .ed__text > :nth-child(7) { animation-delay: 640ms; }
  .ed__tiles:not(.is-in) li { opacity: 0; }
  .ed__tiles.is-in li { animation: hm-rise 800ms var(--hm-ease-out) both; animation-delay: calc(var(--i) * 90ms); }
}

@media (max-width: 1279px) { .ed__tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ed__rail { grid-auto-columns: calc((100% - 3 * 24px) / 3.6); } }
@media (max-width: 899px) { .ed__rail { gap: 18px; grid-auto-columns: calc((100% - 2 * 18px) / 2.6); } }
@media (max-width: 599px) {
  .ed__tiles { grid-template-columns: 1fr; gap: 14px; }
  .ed__tile { grid-template-columns: 42% 1fr; }
  .ed__tile-img { min-height: 190px; }
  .ed__tile-body { padding: 10px 6px 6px 16px; }
  .ed__tile-ic { width: 26px; }
  .ed__tile-t { margin-top: 8px; font-size: 1.22rem; }
  .ed__tile-l { font-size: 0.88rem; }
  .ed__tile-go svg { width: 36px; height: 36px; }
  .ed__rail { gap: 14px; grid-auto-columns: 62%; }
  .ed__picks-head .ed__arrows { display: none; }
  .ed__line { letter-spacing: 0.24em; padding-left: 0.24em; }
}
@media (prefers-reduced-motion: reduce) {
  .ed__cta, .ed__cta svg, .ed__tile, .ed__tile-img .ph-img, .ed__tile-go svg, .ed__arrow { transition: none; }
}

/* Portrait tablets (720–1099): the tablet photograph full-bleed, the words over the dark curtain
   and night sky on her right, as in the owner's mobile reference (8 Oct 2026 tablet review). */
@media (min-width: 720px) and (max-width: 1099px) and (orientation: portrait) {
  .ed__band { height: min(118vw, 1000px, calc(100svh - 40px)); min-height: 760px; }
  .ed__media { position: absolute; inset: 0; aspect-ratio: auto; max-height: none; height: 100%; }
  .ed__media img { object-position: 22% 8%; width: 106%; max-width: none; margin-left: -6%; }
  .ed__media::after { display: none; }
  .ed__shade { display: block; background:
    linear-gradient(270deg, rgba(29, 7, 9, 0.86) 0%, rgba(29, 7, 9, 0.7) 32%, rgba(29, 7, 9, 0.25) 50%, rgba(29, 7, 9, 0) 60%),
    linear-gradient(0deg, rgba(29, 7, 9, 0.55) 0%, rgba(29, 7, 9, 0) 25%); }
  .ed__text { position: absolute; top: 0; bottom: 0; right: clamp(16px, 3vw, 40px); width: 41%; margin: 0; padding: 0; align-content: center; gap: 9px; }
  .ed__kicker { font-size: 1.45rem; }
  .ed__title { font-size: clamp(2.5rem, 5.6vw, 3.3rem); line-height: 1.04; }
  .ed__line { font-size: 0.7rem; letter-spacing: 0.26em; padding-left: 0.26em; line-height: 1.9; max-width: 20em; }
  .ed__intro { font-size: 1rem; max-width: 26ch; }
  .ed__cta { padding: 0 18px 0 26px; font-size: 0.74rem; letter-spacing: 0.18em; }
  .ed__crest i, .ed__rule i { width: 44px; }
}
/* Tablets: more, smaller sarees in view. */
@media (min-width: 700px) and (max-width: 1099px) { .ed__rail { gap: 18px; grid-auto-columns: calc((100% - 3 * 18px) / 3.4); } }

/* ── Slot 4 · Shop by Category (permanent; owner's reference composition, 8 Oct 2026) ──
   Measured from the reference (1536 × 1024): feature and rows are equal halves with a 15 px gap;
   five rows of about 4.6 : 1 stack to the feature's height; the feature's photograph starts at
   21–26 % of its width; type sizes are in container units of the card so they keep the
   reference's proportions as the card scales. */
.cx { --cx-ivory: #f8f0e5; --cx-panel: #fbf5ec; --cx-gold: #b08a4a; --cx-hair: #e8dbc6; --cx-sub: #5d4c46;
  position: relative; background: var(--cx-ivory); padding-block: clamp(20px, 3vw, 44px) clamp(64px, 7vw, 108px); color: var(--ui-text); }
.cx__in { max-width: 1440px; margin-inline: auto; padding-inline: var(--hm-gutter); }
.cx__head { display: grid; justify-items: center; text-align: center; gap: 6px; margin-bottom: clamp(26px, 3vw, 40px); }
.cx__crest { display: flex; align-items: center; gap: 8px; color: var(--cx-gold); margin-bottom: 4px; }
.cx__crest i { display: block; width: clamp(60px, 7vw, 96px); height: 1px; background: currentColor; opacity: 0.7; }
.cx__crest .dh__diamond { width: 22px; }
.cx__title { margin: 0; font-family: var(--hx-serif); font-weight: 500; font-size: clamp(2.3rem, 3.9vw, 3.75rem); line-height: 1.08; color: var(--ui-accent); }
.cx__line { margin: 2px 0 0; font-family: var(--ui-font-display); font-weight: 400; font-size: clamp(0.9rem, 1.1vw, 1.06rem); letter-spacing: 0.2em; padding-left: 0.2em; color: #3d2e2c; }

.cx__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(10px, 1vw, 15px); align-items: stretch; }
.cx__no { font-family: var(--hx-serif); font-weight: 400; color: var(--cx-gold); line-height: 1; }
.cx__no::after { content: ''; display: block; height: 1px; background: currentColor; opacity: 0.7; }
.cx__go { position: relative; flex: none; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--cx-gold); color: var(--cx-gold);
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), transform var(--ui-dur-slow) var(--hm-ease-out); }
.cx__go svg { width: 42%; height: 42%; }
.cx__subs { list-style: none; margin: 0; padding: 0; }
.cx__sub { position: relative; z-index: 2; font-family: var(--ui-font-display); font-weight: 400; letter-spacing: 0.12em; color: var(--cx-sub); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px;
  transition: color var(--ui-dur-base) var(--ui-ease), text-decoration-color var(--ui-dur-base) var(--ui-ease); }
a.cx__sub:hover { color: var(--ui-accent); text-decoration-color: currentColor; }
a.cx__sub:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 2px; border-radius: 2px; }
.cx__sub--none { color: color-mix(in srgb, var(--cx-sub) 45%, transparent); }
.cx .ph-img { transition: transform 1100ms var(--hm-ease-out); }
.cx__fimg, .cx__rimg { position: relative; z-index: 0; overflow: hidden; background: radial-gradient(80% 65% at 50% 38%, #5a1a26, #2a0c12 72%, #1d0709); }
.cx .ph-fan > span { padding: 3px; background: #fffaf3; box-shadow: 0 8px 18px rgba(0, 0, 0, 0.45); }
.cx .ph-fan > span:nth-child(3) { transform: translateX(52%) rotate(8deg); }
.cx .cx__fan--2 > span:nth-child(1) { transform: translateX(-30%) rotate(-6deg); }
.cx .cx__fan--2 > span:nth-child(2) { transform: translateX(30%) rotate(6deg); }

/* Feature */
.cx__feature { position: relative; isolation: isolate; container-type: inline-size; min-height: 100%; }
.cx__fimg { position: absolute; top: 0; bottom: 0; right: 0; left: 20%; border-radius: 0 6px 6px 0; }
.cx__fimg .ph-img { object-position: 54% 18%; }
.cx__fimg .ph-fan > span { width: 30%; }
.cx__panel-bg { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; filter: drop-shadow(6px 0 14px rgba(60, 20, 10, 0.12)); clip-path: inset(0 -60px 0 0); }
.cx__panel-bg path { fill: var(--cx-panel); }
.cx__frame { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.cx__frame path { fill: none; stroke: var(--cx-gold); stroke-width: 1; vector-effect: non-scaling-stroke; opacity: 0.8; }
.cx__flower { position: absolute; z-index: 1; left: 0; top: 4.2%; width: max(26px, 5.4cqw); height: auto; translate: -50% -50%; color: var(--cx-gold); background: var(--cx-ivory); border-radius: 50%; }
.cx__botanic { position: absolute; z-index: 1; left: 0.5%; bottom: 0.4%; width: 21%; height: auto; color: var(--cx-gold); opacity: 0.38; pointer-events: none; }
.cx__flink { position: absolute; z-index: 2; inset: 0; }
.cx__panel { position: absolute; z-index: 3; left: 5.4%; top: 20%; width: 26%; display: flex; flex-direction: column; align-items: flex-start; pointer-events: none; }
.cx__panel a { pointer-events: auto; }
.cx__panel .cx__no { font-size: max(15px, 2.6cqw); }
.cx__panel .cx__no::after { width: max(30px, 5.8cqw); margin: max(14px, 2.6cqw) 0 0; }
.cx__fname { margin: max(22px, 4.6cqw) 0 0; width: min-content; font-family: var(--hx-serif); font-weight: 500; font-size: clamp(30px, 7.3cqw, 58px); line-height: 1.12; letter-spacing: -0.005em; }
.cx__flabel { color: var(--ui-accent); text-decoration: none; }
.cx__flabel:focus-visible { outline: 0; }
.cx__feature:has(.cx__flabel:focus-visible) { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 4px; }
.cx__subs--stack { margin-top: max(14px, 2.6cqw); display: grid; gap: 0.12em; }
.cx__subs--stack .cx__sub { font-size: clamp(13px, 2.1cqw, 17px); line-height: 1.45; }
.cx__panel .cx__go { margin-top: max(20px, 4.6cqw); width: clamp(46px, 8.6cqw, 64px); height: clamp(46px, 8.6cqw, 64px); }
.cx__rule { display: block; margin-top: max(22px, 4.6cqw); width: max(30px, 6.8cqw); height: 1px; background: var(--cx-gold); opacity: 0.7; }

/* Rows */
.cx__rows { list-style: none; margin: 0; padding: 0; display: grid; grid-auto-rows: minmax(min-content, 1fr); gap: clamp(7px, 0.65vw, 10px); }
.cx__rows > li { min-width: 0; }
.cx__row { position: relative; height: 100%; container-type: inline-size; display: grid; grid-template-columns: 48.8% minmax(0, 1fr); min-height: clamp(116px, 10.4vw, 156px); }
.cx__rimg { border-radius: 6px 0 0 6px; }
.cx__rimg .ph-img { object-position: 50% 55%; }
.cx__rimg .ph-fan > span { width: 24%; }
.cx__rbody { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; min-width: 0;
  padding: 12px calc(10.5cqw + 6px) 12px 5.3cqw; background: var(--cx-panel); border: 1px solid var(--cx-hair); border-left: 0; border-radius: 0 6px 6px 0; }
.cx__rbody .cx__no { font-size: clamp(13px, 2.1cqw, 16px); }
.cx__rbody .cx__no::after { width: clamp(22px, 3.9cqw, 30px); margin-top: clamp(7px, 1.3cqw, 10px); }
.cx__rname { margin: clamp(8px, 1.7cqw, 13px) 0 0; font-family: var(--hx-serif); font-weight: 500; font-size: clamp(18px, 3.5cqw, 27px); line-height: 1.12; text-wrap: balance; }
.cx__link { color: var(--ui-accent); text-decoration: none; }
.cx__link::after { content: ''; position: absolute; inset: 0; z-index: 1; } /* the whole row opens the category */
.cx__link:focus-visible { outline: 0; }
.cx__row:has(.cx__link:focus-visible) { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }
.cx__subs--line { margin-top: clamp(4px, 1cqw, 8px); display: flex; flex-wrap: wrap; }
.cx__subs--line li:not(:last-child)::after { content: '·'; margin: 0 0.35em; color: var(--cx-gold); }
.cx__subs--line .cx__sub { font-size: clamp(12px, 1.95cqw, 14px); line-height: 1.6; letter-spacing: 0.07em; }
.cx__row > .cx__go { position: absolute; right: 4.2cqw; top: 54%; translate: 0 -50%; width: clamp(38px, 6.6cqw, 50px); height: clamp(38px, 6.6cqw, 50px); }

@media (hover: hover) {
  .cx__feature:hover .ph-img, .cx__row:hover .ph-img { transform: scale(1.04); }
  .cx__feature:hover .cx__go, .cx__row:hover .cx__go { background: #d6b06a; border-color: #d6b06a; color: #3b0b1d; transform: translateX(2px); }
  .cx__row:hover > .cx__go { transform: translate(2px, 0); }
}
@media (prefers-reduced-motion: no-preference) {
  .cx__layout:not(.is-in) .cx__feature, .cx__layout:not(.is-in) .cx__rows > li { opacity: 0; }
  .cx__layout.is-in .cx__feature { animation: hm-rise 850ms var(--hm-ease-out) both; }
  .cx__layout.is-in .cx__rows > li { animation: hm-rise 800ms var(--hm-ease-out) both; animation-delay: calc(120ms + var(--i) * 80ms); }
}

/* Tablet: the feature runs full width above the rows, in the same composition. */
@media (max-width: 1099px) {
  .cx__layout { grid-template-columns: 1fr; }
  .cx__feature { aspect-ratio: 1.45; min-height: 0; }
  .cx__fimg { left: 20%; }
  .cx__fimg .ph-img { object-position: 54% 8%; }
  .cx__panel { top: 14%; width: 30%; }
  .cx__fname { font-size: clamp(30px, 6cqw, 50px); }
  .cx__subs--stack .cx__sub { font-size: clamp(13px, 1.9cqw, 16px); }
  .cx__panel .cx__go { width: 52px; height: 52px; }
  .cx__rule, .cx__panel .cx__no::after { width: 34px; }
  .cx__botanic { display: none; }
  .cx__panel { top: 11%; }
  .cx__row { min-height: 136px; }
}
.cx__flower--m { display: none; }
/* Phone (owner, 8 Oct 2026: "enhance more"): the feature becomes a tall portrait with an arched
   ivory card rising over its foot, a gold arch line inside and the flower at its crown; the rows
   alternate sides in a zig-zag, each photograph carrying its numeral in large italic. */
@media (max-width: 599px) {
  .cx__head { margin-bottom: 24px; }
  .cx__line { letter-spacing: 0.14em; padding-left: 0.14em; font-size: 0.86rem; }
  .cx__layout { gap: 16px; }
  .cx__feature { aspect-ratio: auto; display: block; }
  .cx__fimg { position: relative; inset: auto; display: block; aspect-ratio: 4 / 5; border-radius: 14px; }
  .cx__fimg .ph-img { object-position: 54% 12%; }
  .cx__fimg::after { content: ''; position: absolute; inset: auto 0 0; height: 40%; background: linear-gradient(180deg, transparent, rgba(29, 7, 9, 0.35)); }
  .cx__panel-bg, .cx__frame, .cx__flower:not(.cx__flower--m), .cx__rule, .cx__botanic { display: none; }
  .cx__panel { position: relative; inset: auto; width: auto; margin: -132px 14px 0; padding: 46px 22px 26px; align-items: center; text-align: center; background: var(--cx-panel);
    border-radius: 170px 170px 14px 14px / 96px 96px 14px 14px; box-shadow: 0 -12px 30px -14px rgba(29, 7, 9, 0.5), 0 14px 26px -18px rgba(60, 20, 10, 0.4); }
  .cx__panel::after { content: ''; position: absolute; inset: 8px; pointer-events: none; border: 1px solid color-mix(in srgb, var(--cx-gold) 55%, transparent); border-radius: 162px 162px 9px 9px / 90px 90px 9px 9px; }
  .cx__flower--m { display: block; position: absolute; left: 50%; top: 0; translate: -50% -50%; width: 34px; padding: 3px; color: var(--cx-gold); background: var(--cx-panel); border-radius: 50%; }
  .cx__panel .cx__no::after { margin-inline: auto; width: 28px; }
  .cx__fname { width: auto; margin-top: 14px; font-size: 2.55rem; }
  .cx__subs--stack { margin-top: 10px; display: flex; flex-wrap: wrap; justify-content: center; gap: 0; }
  .cx__subs--stack li:not(:last-child)::after { content: '·'; margin: 0 0.45em; color: var(--cx-gold); }
  .cx__subs--stack .cx__sub { font-size: 14px; }
  .cx__panel .cx__go { margin-top: 18px; width: 50px; height: 50px; }

  .cx__rows { gap: 12px; }
  .cx__row { min-height: 136px; grid-template-columns: 44% minmax(0, 1fr); }
  .cx__rimg { border-radius: 12px 0 0 12px; }
  .cx__rimg::after { content: attr(data-no); position: absolute; left: 12px; bottom: 6px; font-family: var(--hx-serif); font-style: italic; font-size: 2.1rem; line-height: 1; color: #fff7ea;
    text-shadow: 0 2px 12px rgba(29, 7, 9, 0.7); }
  .cx__rimg::before { content: ''; position: absolute; z-index: 1; inset: auto 0 0; height: 55%; background: linear-gradient(180deg, transparent, rgba(29, 7, 9, 0.45)); }
  .cx__rimg::after { z-index: 2; }
  .cx__rbody { padding: 14px 54px 14px 16px; border-radius: 0 12px 12px 0; }
  .cx__rbody .cx__no { display: none; }
  .cx__rname { margin: 0; font-size: 20px; }
  .cx__subs--line { margin-top: 6px; }
  .cx__subs--line .cx__sub { font-size: 12.5px; letter-spacing: 0.05em; }
  .cx__row > .cx__go { right: 12px; width: 36px; height: 36px; }
  .cx__rows > li:nth-child(even) .cx__row { grid-template-columns: minmax(0, 1fr) 44%; }
  .cx__rows > li:nth-child(even) .cx__rimg { order: 2; border-radius: 0 12px 12px 0; }
  .cx__rows > li:nth-child(even) .cx__rimg::after { left: auto; right: 12px; }
  .cx__rows > li:nth-child(even) .cx__rbody { order: 1; border-left: 1px solid var(--cx-hair); border-right: 0; border-radius: 12px 0 0 12px; padding: 14px 16px 14px 18px; padding-right: 54px; }
  .cx__rows > li:nth-child(even) .cx__row > .cx__go { right: calc(44% + 12px); }
}
/* The weave ribbon on this page: plum between two gold hairlines, gold diamonds between weaves. */
.dh-ribbon { margin-top: 0; border-block: 1px solid #c9a45f; background: linear-gradient(180deg, color-mix(in srgb, var(--ui-accent) 92%, black), var(--ui-accent)); }
.dh-ribbon i { background: #d6b06a; }
@media (prefers-reduced-motion: reduce) { .cx .ph-img, .cx__go, .cx__sub { transition: none; } }

/* ── Slot 5 · Occasions (permanent; owner's reference, 8 Oct 2026) ─────────────────────
   Tall ivory cards (1 : 1.95), arch-topped, each with its own photograph edge and its own motion;
   four in view on wide screens as in the reference, the rest a swipe away. */
.o2s { --o2-ivory: #f8efe6; --o2-card: #fbf3ec; --o2-gold: #b08a4a; position: relative; isolation: isolate; overflow: hidden;
  background: radial-gradient(90% 60% at 50% 20%, #fdf8f3, var(--o2-ivory) 70%); padding-block: clamp(56px, 6vw, 92px) clamp(56px, 6vw, 96px); color: var(--ui-text); }
.o2s .sm__paper { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; opacity: 0.08; mix-blend-mode: multiply; pointer-events: none; }
.o2__defs { position: absolute; width: 0; height: 0; }
.o2s__flora { position: absolute; z-index: -1; width: clamp(110px, 11vw, 190px); color: var(--o2-gold); opacity: 0.32; pointer-events: none; }
.o2s__flora--t { right: -1%; top: 9%; rotate: 12deg; }
.o2s__flora--b { right: 2%; bottom: -4%; rotate: -8deg; opacity: 0.24; }
.o2s__in { max-width: 1440px; margin-inline: auto; padding-inline: var(--hm-gutter); }
.o2s__head { display: grid; justify-items: center; text-align: center; gap: 10px; margin-bottom: clamp(30px, 3.4vw, 50px); }
.o2s__title { margin: 0; font-family: var(--hx-serif); font-weight: 500; font-size: clamp(2.6rem, 4.6vw, 4.4rem); line-height: 1.04; color: var(--ui-accent); }
.o2s__sub { margin: 2px 0 0; font-family: var(--ui-font-display); font-size: clamp(0.86rem, 1.15vw, 1.08rem); letter-spacing: 0.28em; padding-left: 0.28em; color: #3d2e2c; }

.o2s__row { list-style: none; margin: 0; padding: 14px 0 18px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(18px, 1.8vw, 28px); align-items: start; }
.o2s__row::-webkit-scrollbar { display: none; }
.o2__item { position: relative; min-width: 0; }
/* All six in one row, set as a temple roofline: the centre pair (Festive Celebrations, Weddings)
   stands tallest and the cards step down symmetrically to each side. */
.o2__item:nth-child(1), .o2__item:nth-child(6) { padding-top: 64px; }
.o2__item:nth-child(2), .o2__item:nth-child(5) { padding-top: 32px; }

/* The card */
.o2 { position: relative; display: block; aspect-ratio: 0.47; container-type: inline-size; text-decoration: none; color: inherit; transition: transform 700ms var(--hm-ease-out); }
.o2__bg { position: absolute; inset: 0; border-radius: 50% 50% 7% 7% / 25.6% 25.6% 3.6% 3.6%; background: var(--o2-card);
  box-shadow: 0 18px 34px -24px rgba(60, 20, 10, 0.45), inset 0 0 0 1px rgba(176, 138, 74, 0.12); transition: box-shadow var(--ui-dur-slow) var(--ui-ease); }
.o2__photo { position: absolute; left: 0; right: 0; top: 0; overflow: hidden; background: #e9dccd; }
.o2__photo .ph-img { animation: oc-breathe var(--drift, 19s) ease-in-out infinite alternate; animation-delay: calc(var(--i) * -3.7s); animation-play-state: paused; }
/* Inset arch (Festive) and ringed arch (Gifting): the photograph sits inside a larger ivory arch. */
.o2--inset .o2__photo { left: 7%; right: 7%; top: 12%; height: 56%; border-radius: 50% 50% 0 0 / 39.4% 39.4% 0 0; }
.o2--ring .o2__photo { left: 9.5%; right: 9.5%; top: 10.5%; height: 57%; border-radius: 50% 50% 0 0 / 37.6% 37.6% 0 0; }
.o2--inset .o2__bg, .o2--ring .o2__bg { background: color-mix(in srgb, var(--o2-card) 70%, #f3e4d6); }
.o2__body { position: absolute; left: 9%; right: 9%; bottom: 6%; display: flex; flex-direction: column; align-items: flex-start; }
.o2--wave .o2__body { right: 36%; }
.o2__name { font-family: var(--hx-serif); font-weight: 500; font-size: clamp(20px, 8.4cqw, 34px); line-height: 1.12; color: var(--ui-accent); text-wrap: balance; }
.o2__line { margin-top: 3.6cqw; font-family: var(--ui-font-display); font-size: clamp(11.5px, 4cqw, 15px); letter-spacing: 0.11em; line-height: 1.6; color: #4a3b38; text-wrap: balance; max-width: 18em; min-height: 3.2em; }
.o2__go { margin-top: 6cqw; width: clamp(38px, 12.6cqw, 50px); height: clamp(38px, 12.6cqw, 50px); border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--o2-gold); color: var(--ui-accent);
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), transform var(--ui-dur-slow) var(--hm-ease-out); }
.o2__go svg { width: 46%; height: 46%; }

/* Festive: a gold four-point star on the outer arch, a thread falling from it; it twinkles. */
.o2__star { position: absolute; z-index: 2; right: 7%; top: 7%; width: 11cqw; height: auto; color: var(--o2-gold); transform-origin: 50% 33%;
  animation: o2-twinkle 5.5s ease-in-out infinite; animation-play-state: paused; }
@keyframes o2-twinkle { 0%, 100% { transform: scale(0.9) rotate(0deg); } 50% { transform: scale(1.08) rotate(8deg); } }
/* The glow: the same star in the glow colour, blurred as drop-shadow(0 0 6px) blurs, fading in and out. */
.o2__star--glow { z-index: 1; color: rgba(255, 210, 140, 0.9); filter: blur(3px); opacity: 0; animation-name: o2-twinkle-glow; }
@keyframes o2-twinkle-glow { 0%, 100% { transform: scale(0.9) rotate(0deg); opacity: 0; } 50% { transform: scale(1.08) rotate(8deg); opacity: 1; } }
/* Evening: a gold rod with a small star at the card's lower right; a light runs down it. */
.o2__rod { position: absolute; right: 8%; top: 74%; height: 22%; width: 6px; color: var(--o2-gold); opacity: 0.8; }
.o2__rod-orn { position: absolute; right: calc(8% - 7px); top: 81%; width: 20px; height: 20px; color: var(--o2-gold); background: var(--o2-card); }
.o2--scurve::after { content: ''; position: absolute; right: calc(8% + 1.5px); top: 76%; width: 3px; height: 4%; border-radius: 2px; opacity: 0; translate: 50% 0;
  background: linear-gradient(180deg, transparent, #fff3d6, transparent); box-shadow: 0 0 6px 1px rgba(255, 220, 150, 0.8); animation: o2-rod 7s ease-in-out infinite 1.5s; animation-play-state: paused; }
@keyframes o2-rod { 0% { opacity: 0; transform: translateY(0); } 6% { opacity: 1; } 34% { opacity: 1; } 40% { opacity: 0; transform: translateY(430%); } 100% { opacity: 0; transform: translateY(430%); } }
/* Gifting: a gold line round the inset arch, a bead of light travelling round it, endlessly. */
@property --o2-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.o2__ringline { position: absolute; left: calc(9.5% - 7px); right: calc(9.5% - 7px); top: calc(10.5% - 7px); height: calc(57% + 7px); padding: 1.4px; pointer-events: none;
  border-radius: 50% 50% 0 0 / 39% 39% 0 0; border-bottom: 0;
  overflow: hidden; container-type: size;
  -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
/* The bead of light: the same conic band, drawn on an oversized square centred on the ring and turned
   by transform (scroll performance, 9 Oct 2026: animating the gradient's angle repainted every frame). */
.o2__ringline::before { content: ''; position: absolute; left: 50%; top: 50%; width: 150cqmax; aspect-ratio: 1; /* covers the ring's diagonal at every turn */
  background: conic-gradient(from 0deg, rgba(176, 138, 74, 0.55) 0deg 300deg, #fff3d6 330deg, rgba(176, 138, 74, 0.55) 360deg);
  transform: translate(-50%, -50%) rotate(0deg); animation: o2-ring 9s linear infinite; animation-play-state: paused; }
@keyframes o2-ring { to { transform: translate(-50%, -50%) rotate(360deg); } }

/* Gold dividers between cards (wide screens), a bead of light running down each in turn. */
.o2__div { position: absolute; top: 24%; bottom: 6%; right: calc(-0.5 * clamp(18px, 1.8vw, 28px)); width: 1px; overflow: visible; pointer-events: none;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, #b08a4a 60%, transparent) 10%, color-mix(in srgb, #b08a4a 60%, transparent) 92%, transparent); }
.o2__div::before, .o2__div::after { content: ''; position: absolute; left: 50%; width: 7px; height: 7px; translate: -50% 0; rotate: 45deg; border: 1px solid #b08a4a; background: var(--o2-ivory); }
.o2__div::before { top: 0; } .o2__div::after { bottom: 0; }
.o2s .oc__div i { position: absolute; left: -1px; top: 0; width: 3px; height: 16%; border-radius: 2px; opacity: 0; background: linear-gradient(180deg, transparent, #fff3d6, transparent); box-shadow: 0 0 6px 1px rgba(255, 220, 150, 0.8);
  animation: oc-glint 8s ease-in-out infinite; animation-delay: calc(var(--i) * 1.6s + 1s); animation-play-state: paused; }
@keyframes oc-glint { 0% { opacity: 0; transform: translateY(0); } 3% { opacity: 1; } 18% { opacity: 1; } 22% { opacity: 0; transform: translateY(560%); } 100% { opacity: 0; transform: translateY(560%); } }

/* Shared motion: gleam (one card at a time), breathing photographs, lamplight. */
.o2s .oc__gleam { position: absolute; inset: -10% -60%; pointer-events: none; opacity: 0; mix-blend-mode: soft-light; transform: translateX(-40%);
  background: linear-gradient(105deg, transparent 38%, rgba(255, 236, 196, 0.08) 44%, rgba(255, 240, 210, 0.4) 50%, rgba(255, 236, 196, 0.08) 56%, transparent 62%);
  animation: oc-gleam 21s ease-in-out infinite; animation-delay: calc(var(--i) * 3.5s + 0.8s); animation-play-state: paused; }
@keyframes oc-gleam { 0% { opacity: 0; transform: translateX(-40%); } 1.2% { opacity: 1; } 6.5% { opacity: 1; } 7.6% { opacity: 0; transform: translateX(40%); } 100% { opacity: 0; transform: translateX(40%); } }
@keyframes oc-breathe { from { scale: 1; } to { scale: 1.045; } }
.o2s .oc__lamps { position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen; }
.o2s .oc__lamps i { position: absolute; width: 24%; aspect-ratio: 1; translate: -50% -50%; border-radius: 50%; opacity: 0.3;
  background: radial-gradient(closest-side, rgba(255, 196, 120, 0.75), rgba(255, 150, 70, 0.22) 50%, transparent); animation: dh-breathe var(--gd) ease-in-out var(--gl) infinite alternate; animation-play-state: paused; }
.o2s.is-live .ph-img, .o2s.is-live .oc__gleam, .o2s.is-live .oc__lamps i, .o2s.is-live .oc__div i, .o2s.is-live .o2__star, .o2s.is-live .o2--scurve::after, .o2s.is-live .o2__ringline::before { animation-play-state: running; }
/* Hover/focus: the card lifts, its arrow fills gold, its own motion holds still. */
.o2:hover, .o2:focus-visible { transform: translateY(-6px); }
.o2:hover .o2__bg, .o2:focus-visible .o2__bg { box-shadow: 0 26px 40px -24px rgba(60, 20, 10, 0.55), inset 0 0 0 1px rgba(176, 138, 74, 0.3); }
.o2:hover .o2__go, .o2:focus-visible .o2__go { background: #d6b06a; border-color: #d6b06a; color: #3b0b1d; transform: translateX(3px); }
.o2s .o2:hover :is(.ph-img, .oc__gleam, .oc__lamps i, .o2__star), .o2s .o2:focus-visible :is(.ph-img, .oc__gleam, .oc__lamps i, .o2__star),
.o2s .o2--scurve:hover::after, .o2s .o2:hover .o2__ringline::before { animation-play-state: paused; }
.o2:focus-visible { outline: 0; }
.o2:focus-visible .o2__bg { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }
.o2s__controls { display: flex; justify-content: center; margin-top: 18px; }
.o2s__controls[hidden] { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .o2s:not(.is-in) .o2__item { opacity: 0; }
  .o2s.is-in .o2__item { animation: hm-rise 850ms var(--hm-ease-out) both; animation-delay: calc(var(--i) * 90ms); }
}
/* Six columns are narrow: keep the words on the ivory by setting every photograph to the same
   height and the words centred beneath it. */
@media (min-width: 600px) {
  .o2s .o2__photo { height: 60% !important; }
  .o2--inset .o2__photo, .o2--ring .o2__photo { height: 46% !important; }
  .o2--ring .o2__ringline { height: calc(46% + 7px); }
  .o2__body, .o2--wave .o2__body { left: 8%; right: 8%; bottom: 6%; align-items: center; text-align: center; }
  .o2__name { font-size: clamp(18px, 10cqw, 28px); }
  .o2__line { font-size: clamp(11px, 5.2cqw, 14px); letter-spacing: 0.06em; }
  .o2__star { right: 6%; top: 6%; width: 13cqw; }
  .o2__rod, .o2__rod-orn, .o2--scurve::after { display: none; }
}
/* Below 1360px (six would be too narrow): two rows of three, the middle column raised. */
@media (min-width: 600px) and (max-width: 1359px) {
  .o2s__row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 24px; }
  .o2__item:nth-child(n) { padding-top: 0; }
  .o2__item:nth-child(3n + 1), .o2__item:nth-child(3n) { padding-top: 40px; }
  .o2__item:nth-child(3n) .o2__div { display: none; }
  .o2 { aspect-ratio: 0.56; }
  .o2--inset .o2__photo, .o2--ring .o2__photo { top: 9% !important; height: 45% !important; }
  .o2--ring .o2__ringline { top: calc(9% - 7px); height: calc(45% + 7px); }
}
/* Phones (owner, 8 Oct 2026: "occasion cards not good on mobile"): a two-column plate of lit
   arches. Each photograph fills its card inside a gold rim, the words on it over a soft shade; each
   occasion keeps its own arch (temple point, scalloped, round, soft, lancet, wave) and its motion. */
@media (max-width: 599px) {
  .o2s { padding-block: 48px 64px; }
  .o2s__head { margin-bottom: 28px; }
  .o2s__sub { letter-spacing: 0.16em; padding-left: 0.16em; font-size: 0.8rem; }
  .o2s__flora--t { top: 3%; width: 90px; }
  .o2s__row { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-columns: auto; gap: 16px 12px; overflow: visible; padding: 0 0 30px; align-items: start; }
  .o2__item { padding-top: 0 !important; }
  .o2__item:nth-child(even) { translate: 0 30px; }
  .o2__div, .o2s__controls, .o2__star, .o2__rod, .o2__rod-orn, .o2__ringline { display: none !important; }
  .o2--scurve::after { display: none; }
  .o2 { --om: url(#om-round); aspect-ratio: 0.66; filter: drop-shadow(0 12px 18px rgba(60, 20, 10, 0.22)); }
  .o2--wave { --om: url(#om-ogee); } .o2--inset { --om: url(#om-cusp); } .o2--scurve { --om: url(#om-round); }
  .o2--corner { --om: url(#om-soft); } .o2--ring { --om: url(#om-lancet); } .o2--bowl { --om: url(#om-wave); }
  /* The gold rim: the card's shape in gold, the photograph the same shape set 2 px inside it. */
  .o2s .o2 .o2__bg { inset: 0; border-radius: 0; clip-path: var(--om); box-shadow: none; background: linear-gradient(150deg, #f1d08f, #b08a4a 45%, #e6c788 70%, #8f6a31); }
  .o2__photo { inset: 2px !important; left: 2px; right: 2px; top: 2px; height: auto !important; border-radius: 0 !important; clip-path: var(--om) !important; }
  .o2__photo .ph-img { object-position: 50% 18% !important; }
  .o2__photo::after { content: ''; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(180deg, rgba(29, 7, 9, 0) 40%, rgba(29, 7, 9, 0.55) 62%, rgba(29, 7, 9, 0.9) 84%, rgba(29, 7, 9, 0.95) 100%); }
  .o2__body, .o2--wave .o2__body { left: 9%; right: 9%; bottom: 7%; align-items: center; text-align: center; }
  .o2__name { font-size: clamp(16px, 10.2cqw, 20px); color: #fbefd6; text-shadow: 0 2px 10px rgba(29, 7, 9, 0.55); }
  .o2__line { margin-top: 2.4cqw; font-size: max(10.5px, 5.8cqw); letter-spacing: 0.03em; line-height: 1.4; min-height: 0; color: #ead8b6; }
  .o2__go { margin-top: 4cqw; width: 30px; height: 30px; border-color: rgba(227, 193, 127, 0.85); color: #f6e7c8; }
  .o2:hover .o2__go, .o2:focus-visible .o2__go { color: #3b0b1d; }
  .o2:hover, .o2:focus-visible { transform: none; }
  .o2s .o2:focus-visible .o2__bg { outline: 0; background: var(--ui-accent); }
}
@keyframes oc-gleam-solo { 0% { opacity: 0; transform: translateX(-40%); } 4% { opacity: 1; } 24% { opacity: 1; } 28% { opacity: 0; transform: translateX(40%); } 100% { opacity: 0; transform: translateX(40%); } }
@media (prefers-reduced-motion: reduce) {
  .o2s :is(.ph-img, .oc__gleam, .oc__lamps i, .oc__div i, .o2__star), .o2s .o2__ringline::before, .o2--scurve::after { animation: none !important; }
  .o2s .oc__gleam, .o2s .oc__div i, .o2--scurve::after { display: none; }
  .o2, .o2__go, .o2__bg { transition: none; }
}

/* ── Slot 3 · "Nine, handpicked" rebuilt to the owner's reference (8 Oct 2026) ──────────
   (Slot 3 was frozen; this row is changed at the owner's request, nothing else in Slot 3.) */
.ep__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px 40px; flex-wrap: wrap; margin-bottom: clamp(24px, 2.6vw, 38px); }
.ep__intro { display: grid; gap: 4px; }
.ep__eyebrow { display: flex; align-items: center; gap: 14px; font-family: var(--ui-font-display); font-size: 0.76rem; font-weight: 600; letter-spacing: 0.32em; text-transform: uppercase; color: var(--ui-accent); }
.ep__eyebrow i { display: block; width: clamp(50px, 7vw, 100px); height: 1px; background: #b08a4a; }
.ep__eyebrow-ic { width: 28px; height: auto; aspect-ratio: 48 / 40; color: var(--ui-accent); margin-left: -8px; }
.ep__title { margin: 6px 0 0; font-family: var(--hx-serif); font-style: italic; font-weight: 500; font-size: clamp(2.5rem, 4.3vw, 4.2rem); line-height: 1.05; color: var(--ui-accent); }
.ep__sub { margin: 6px 0 0; font-family: var(--ui-font-display); font-weight: 300; font-size: clamp(1rem, 1.55vw, 1.5rem); letter-spacing: 0.06em; color: #4a3b38; }
.ep__aside { display: flex; align-items: center; gap: clamp(20px, 3vw, 56px); }
.ep__note { margin: 0; max-width: 24em; font-family: var(--hx-serif); font-size: 0.98rem; line-height: 1.5; color: #5d4c46; }
.ep__nav { display: grid; justify-items: center; gap: 10px; }
.ep__arrows { display: flex; align-items: center; gap: 22px; }
.ep__arrows > i { width: 4px; height: 4px; border-radius: 50%; background: #c9a45f; }
.ep__arrow { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; background: transparent; color: var(--ui-accent); border: 1px solid color-mix(in srgb, #b08a4a 55%, transparent);
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), opacity var(--ui-dur-base) var(--ui-ease), transform var(--ui-dur-fast) var(--ui-ease); }
.ep__arrow svg { width: 22px; height: 22px; }
.ep__arrow--next { background: var(--ui-accent); border-color: var(--ui-accent); color: #fbf1df; box-shadow: 0 8px 18px -8px color-mix(in srgb, var(--ui-accent) 70%, transparent); }
.ep__arrow:hover:not(:disabled) { background: var(--ui-accent); border-color: var(--ui-accent); color: #fbf1df; }
.ep__arrow:active:not(:disabled) { transform: scale(0.95); }
.ep__arrow:disabled { opacity: 0.4; cursor: default; }
.ep__arrow--next:disabled { background: transparent; color: var(--ui-accent); border-color: color-mix(in srgb, #b08a4a 55%, transparent); box-shadow: none; }
.ep__arrow[hidden] { display: none; }
.ep__arrow:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }
.ep__nav.is-static .ep__arrows { display: none; }
.ep__rule { display: flex; align-items: center; gap: 10px; color: #b08a4a; }
.ep__rule i { display: block; width: clamp(60px, 7vw, 96px); height: 1px; background: currentColor; opacity: 0.7; }
.ep__rule-ic { width: 26px; height: auto; aspect-ratio: 48 / 40; }

.ep__rail { gap: 24px; grid-auto-columns: calc((100% - 4 * 24px) / 5); padding: 6px 4px 18px; }
.ep { position: relative; height: 100%; display: flex; flex-direction: column; overflow: hidden; border-radius: 12px; background: #fffaf3;
  box-shadow: 0 1px 0 rgba(176, 138, 74, 0.18), 0 14px 30px -18px rgba(60, 20, 10, 0.35); transition: transform 600ms var(--hm-ease-out), box-shadow var(--ui-dur-slow) var(--ui-ease); }
.ep__img { position: relative; display: block; aspect-ratio: 1; overflow: hidden; background: radial-gradient(80% 70% at 50% 40%, #5a1a26, #2a0c12 72%, #1d0709); }
.ep__img .ph-img { transition: transform 1100ms var(--hm-ease-out); }
.ep__art { position: absolute; inset: 14% 18%; display: block; box-shadow: 0 10px 22px rgba(0, 0, 0, 0.45); transition: transform 1100ms var(--hm-ease-out); }
.ep__art > svg { width: 100%; height: 100%; display: block; }
.ep__tag { position: absolute; left: 14px; top: 14px; padding: 6px 12px 5px; background: var(--ui-accent); color: #fbf1df; font-family: var(--ui-font-display); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; border-radius: 2px; }
.ep__body { flex: 1; display: flex; flex-direction: column; padding: 18px 20px 18px; }
.ep__eye { font-family: var(--ui-font-display); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ui-accent); }
.ep__name { margin: 10px 0 0; font-family: var(--hx-serif); font-weight: 400; font-size: clamp(1.04rem, 1.24vw, 1.28rem); line-height: 1.25; text-wrap: balance; min-height: 2.5em; }
.ep__name a { color: #2b1a1a; text-decoration: none; }
.ep__name a::after { content: ''; position: absolute; inset: 0; z-index: 1; } /* the card opens the saree */
.ep__name a:focus-visible { outline: 0; }
.ep:has(.ep__name a:focus-visible) { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }
.ep__facts { display: flex; gap: 8px; margin-top: 12px; font-size: 0.88rem; color: #6b5a54; }
.ep__facts span + span::before { content: '•'; margin-right: 8px; color: #a99; }
.ep__foot { margin-top: auto; padding-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ep__price { flex: 1; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 7px; padding-top: 12px; border-top: 1px solid #ecdfcf; font-size: 1.22rem; font-weight: 600; color: #2b1a1a; }
.ep__was { font-size: 0.78rem; font-weight: 400; color: #8c7b74; }
.ep__save { padding: 2px 8px; border-radius: 4px; background: #e6f2e6; color: #2f6b34; font-size: 0.74rem; font-weight: 600; }
.ep__bag { position: relative; z-index: 2; flex: none; width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; background: transparent; color: #3b2420; border: 1px solid #b08a4a;
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), transform var(--ui-dur-fast) var(--ui-ease); }
.ep__bag svg { width: 22px; height: 22px; }
.ep__bag:hover { background: var(--ui-accent); border-color: var(--ui-accent); color: #fbf1df; }
.ep__bag:active { transform: scale(0.94); }
.ep__bag:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 2px; }
@media (hover: hover) {
  .ep:hover { transform: translateY(-5px); box-shadow: 0 1px 0 rgba(176, 138, 74, 0.25), 0 22px 36px -18px rgba(60, 20, 10, 0.45); }
  .ep:hover .ph-img { transform: scale(1.05); }
  .ep:hover .ep__art { transform: scale(1.04) rotate(-1deg); }
}
.ep__pager { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 18px; color: #b08a4a; }
.ep__pager[hidden] { display: none; }
.ep__flour { display: flex; align-items: center; gap: 8px; }
.ep__flour i { width: 46px; height: 1px; background: currentColor; opacity: 0.7; }
.ep__flour-ic { width: 26px; height: auto; aspect-ratio: 48 / 40; }
.ep__dots { display: flex; align-items: center; gap: 4px; }
.ep__dot { position: relative; width: 28px; height: 28px; padding: 0; border: 0; background: none; cursor: pointer; }
.ep__dot::before { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 12px; translate: -50% -50%; border-radius: 50%; border: 1px solid #b08a4a; transition: background-color var(--ui-dur-base) var(--ui-ease), border-color var(--ui-dur-base) var(--ui-ease); }
.ep__dot[aria-current='true']::before { background: var(--ui-accent); border-color: var(--ui-accent); }
.ep__dot:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: -2px; border-radius: 50%; }
@media (max-width: 1279px) { .ep__rail { grid-auto-columns: calc((100% - 3 * 22px) / 3.6); gap: 22px; } }
@media (max-width: 899px) { .ep__rail { grid-auto-columns: calc((100% - 2 * 18px) / 2.5); gap: 18px; } .ep__aside { width: 100%; justify-content: space-between; } }
@media (max-width: 599px) {
  .ep__head { gap: 16px; }
  .ep__eyebrow { letter-spacing: 0.24em; font-size: 0.7rem; }
  .ep__note { font-size: 0.92rem; }
  .ep__aside { flex-direction: column; align-items: flex-start; gap: 12px; }
  .ep__nav { display: none; }
  .ep__rail { grid-auto-columns: 72%; gap: 14px; }
  .ep__body { padding: 16px 16px; }
  .ep__price { font-size: 1.18rem; }
  .ep__bag { width: 46px; height: 46px; }
  .ep__flour { display: none; }
  .ep__dot { width: 24px; }
}
@media (prefers-reduced-motion: reduce) { .ep, .ep__img .ph-img, .ep__art, .ep__bag, .ep__arrow, .ep__dot::before { transition: none; } }

/* Preview only (?fonts=prev): the "Nine, handpicked" row in the previous fonts, the approved S2
   card's type (Atelier display for titles, body sans for labels and prices) and the earlier
   heading, for comparison. The new design is otherwise unchanged. */
.ep--prev .ep__eyebrow, .ep--prev .ep__sub, .ep--prev .ep__note { font-family: var(--ui-font-body); }
.ep--prev .ep__eyebrow { font-size: 10.5px; letter-spacing: var(--ui-tracking-label); }
.ep--prev .ep__title { font-weight: 400; font-size: clamp(1.5rem, 2.2vw, 2.1rem); }
.ep--prev .ep__sub { font-weight: 400; font-size: var(--ui-text-md); letter-spacing: 0.02em; }
.ep--prev .ep__note { font-size: var(--ui-text-sm); }
.ep--prev .ep__tag { font-family: var(--ui-font-body); font-size: 10.5px; font-weight: var(--ui-weight-strong); letter-spacing: var(--ui-tracking-label); }
.ep--prev .ep__eye { font-family: var(--ui-font-body); font-size: 10.5px; font-weight: var(--ui-weight-strong); letter-spacing: var(--ui-tracking-label); }
.ep--prev .ep__name { font-family: var(--ui-font-display); font-weight: var(--ui-weight-display); font-size: var(--ui-text-lg); letter-spacing: var(--ui-tracking-display); line-height: 1.3; }
.ep--prev .ep__name a { color: var(--ui-text); }
.ep--prev .ep__facts { font-family: var(--ui-font-body); font-size: var(--ui-text-xs); letter-spacing: 0.02em; color: var(--ui-text-muted); }
.ep--prev .ep__price { font-family: var(--ui-font-body); font-size: var(--ui-text-md); }

/* ── Slot 6 · New Arrivals (the regular Home's rail; styles from home.css) ──────────────
   Only the photographs: the hover view shows the same photograph moved to the pallu. */
.na { padding-bottom: clamp(56px, 7vw, 96px); }
.na .pc__img > img { object-position: 45% 50%; }
.na .pc__img > img.pc__pallu { object-position: 85% 45%; transform: scale(1.35); transform-origin: 80% 50%; }

/* Handpicked card, revised 8 Oct 2026: no heart; the bag button sits where the heart was (a white
   disc on the photograph); the foot is price left, colour variants right, as on the New Arrivals card. */
.ep > .ep__bag { position: absolute; top: 12px; right: 12px; z-index: 2; width: 42px; height: 42px; border: 0; background: #fffaf3; color: var(--ui-accent); box-shadow: 0 4px 12px rgba(29, 7, 9, 0.25); }
.ep > .ep__bag svg { width: 20px; height: 20px; }
.ep > .ep__bag:hover { background: var(--ui-accent); color: #fbf1df; transform: scale(1.06); }
.ep__foot { padding-top: 12px; border-top: 1px solid #ecdfcf; }
.ep__price { padding-top: 0; border-top: 0; }
.ep__foot .pc__colours { flex: none; }

/* ── Slot 7 · Dussehra Drape Stories (owner's references, 8 Oct 2026; cards redesigned) ─────
   The portrait bleeds in from the left and fades into warm ivory; the heading sits over four story
   windows: tall temple arches in a gold niche, each photograph lit, the words on it. Tablets and
   phones: the windows swipe. */
.st { --st-ivory: #fbf2e8; --st-gold: #c39a55; position: relative; isolation: isolate; overflow: hidden; color: var(--ui-text);
  background: radial-gradient(70% 70% at 70% 30%, #fffaf4, var(--st-ivory) 70%); padding-block: clamp(48px, 5vw, 80px) clamp(40px, 4vw, 64px); }
.st__portrait { position: absolute; z-index: -1; left: 0; top: 0; bottom: 0; width: 36%; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, #000 55%, transparent 98%); mask-image: linear-gradient(90deg, #000 55%, transparent 98%); }
.st__pimg { width: 100%; height: 100%; object-fit: cover; object-position: 30% 30%; animation: st-drift 26s ease-in-out infinite alternate; animation-play-state: paused; }
.st.is-live .st__pimg { animation-play-state: running; }
@keyframes st-drift { from { transform: scale(1.02); } to { transform: scale(1.08) translateX(1.5%); } }
.st__standin { position: absolute; left: 8px; bottom: 8px; z-index: 3; padding: 2px 6px; font: 600 9px/1.4 var(--ui-font-body); letter-spacing: 0.08em; text-transform: uppercase; color: #fff; background: rgba(29, 7, 9, 0.55); border-radius: 3px; }
.hm-clean .st__standin { display: none; }
.st__flora { right: -2%; top: auto; bottom: 2%; opacity: 0.22; }
.st__in { position: relative; max-width: 1600px; margin-inline: auto; padding-inline: var(--hm-gutter); padding-left: max(var(--hm-gutter), 25%); }
.st__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.44fr); gap: 24px 40px; align-items: start; margin-bottom: clamp(36px, 3.6vw, 56px); }
.st__head { display: grid; justify-items: center; text-align: center; gap: 8px; }
.st__crest, .st__foot { display: flex; align-items: center; gap: 10px; color: var(--st-gold); }
.st__crest i, .st__foot i { display: block; width: clamp(50px, 6vw, 96px); height: 1px; background: currentColor; opacity: 0.8; }
.st__crest-ic { width: 40px; height: auto; aspect-ratio: 48 / 40; }
.st__kicker { margin-top: 4px; font-family: var(--ui-font-display); font-size: 0.86rem; font-weight: 600; letter-spacing: 0.4em; padding-left: 0.4em; text-transform: uppercase; color: #2b1a1a; }
.st__title { margin: 0; font-family: var(--hx-serif); font-weight: 500; font-size: clamp(2.4rem, 3.7vw, 4rem); line-height: 1.04; color: var(--ui-accent); text-wrap: balance; }
@media (min-width: 1200px) { .st__title { white-space: nowrap; } }
.st__rule { display: flex; align-items: center; gap: 8px; color: var(--st-gold); }
.st__rule i { display: block; width: 34px; height: 1px; background: currentColor; opacity: 0.8; }
.st__rule .dh__diamond { width: 16px; }
.st__rule--m { display: none; }
.st__tag { margin: 6px 0 0; font-family: var(--ui-font-display); font-size: clamp(0.72rem, 0.95vw, 0.92rem); letter-spacing: 0.32em; padding-left: 0.32em; text-transform: uppercase; color: #5d4c46; text-wrap: balance; }
.st__aside { display: grid; gap: 22px; padding-top: 8px; }
.st__note { margin: 0; font-family: var(--hx-serif); font-size: clamp(1rem, 1.15vw, 1.15rem); line-height: 1.55; color: #3d2e2c; }
.st__cta { justify-self: start; display: inline-flex; align-items: center; gap: 12px; min-height: 50px; padding: 0 26px 0 32px; border-radius: 999px; border: 1px solid var(--st-gold); color: #3b0b1d; text-decoration: none;
  font-family: var(--ui-font-display); font-size: 0.74rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; white-space: nowrap; transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease); }
.st__cta svg { width: 18px; height: 18px; transition: transform var(--ui-dur-slow) var(--hm-ease-out); }
.st__cta:hover { background: var(--ui-accent); border-color: var(--ui-accent); color: #fbf1df; }
.st__cta:hover svg { transform: translateX(4px); }
.st__cta:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }
.st__foot { justify-content: center; margin-top: clamp(26px, 3vw, 40px); }

/* Story windows */
.sx-row { list-style: none; margin: 0; padding: 18px 0 6px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(24px, 2.4vw, 38px); }
.sx__item { position: relative; min-width: 0; }
.sx { position: relative; display: block; aspect-ratio: 100 / 208; container-type: inline-size; text-decoration: none; color: inherit; transition: transform 700ms var(--hm-ease-out); }
/* The gold niche round the window, with a lotus finial on its crown. */
.sx__niche { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.sx__rim { fill: color-mix(in srgb, var(--st-ivory) 60%, white); stroke: var(--st-gold); stroke-width: 1.1; vector-effect: non-scaling-stroke; filter: drop-shadow(0 18px 26px rgba(60, 20, 10, 0.16)); }
.sx__spark { fill: none; stroke: #fff1cc; stroke-width: 2.4; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 5 95; stroke-dashoffset: 100; opacity: 0;
  filter: drop-shadow(0 0 3px rgba(255, 214, 140, 0.95)); animation: st-spark 12s linear infinite; animation-delay: calc(var(--i) * 3s + 0.6s); animation-play-state: paused; }
@keyframes st-spark { 0% { stroke-dashoffset: 100; opacity: 0; } 3% { opacity: 1; } 34% { opacity: 1; } 38% { stroke-dashoffset: 62; opacity: 0; } 100% { stroke-dashoffset: 62; opacity: 0; } }
.sx__finial { position: absolute; z-index: 2; left: 50%; top: 1.1%; width: max(26px, 12cqw); height: auto; aspect-ratio: 48 / 40; translate: -50% -88%; color: var(--st-gold);
  background: radial-gradient(closest-side, var(--st-ivory) 60%, transparent); }
/* The window: the photograph fills the arch, the words sit on it over a soft plum shade. */
.sx__win { position: absolute; left: 3.4%; right: 3.4%; top: 2.7%; bottom: 1.6%; overflow: hidden; clip-path: url(#st-arch); background: #2a0c12; }
.sx__photo { position: absolute; inset: 0; }
.sx__photo .ph-img { object-position: 50% 14%; transition: transform 1200ms var(--hm-ease-out); animation: oc-breathe 20s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -4.3s); animation-play-state: paused; }
.sx__shade { position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(29, 7, 9, 0) 50%, rgba(29, 7, 9, 0.45) 64%, rgba(29, 7, 9, 0.88) 82%, rgba(29, 7, 9, 0.95) 100%); transition: opacity var(--ui-dur-slow) var(--ui-ease); }
.sx__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 8% 7.5%; display: flex; flex-direction: column; align-items: center; text-align: center; color: #f6e7c8; }
.sx__name { font-family: var(--hx-serif); font-weight: 500; font-size: clamp(19px, 9cqw, 30px); line-height: 1.1; color: #fbefd6; text-wrap: balance; text-shadow: 0 2px 12px rgba(29, 7, 9, 0.5); }
.sx__line { min-height: 3.1em; /* two lines, so the four names stay level (9 Oct 2026) */ margin-top: 2cqw; font-family: var(--ui-font-display); font-size: clamp(11px, 4.3cqw, 14px); letter-spacing: 0.06em; line-height: 1.55; color: #ead8b6; text-wrap: balance; }
.sx__cta { margin-top: 4cqw; display: inline-flex; align-items: center; gap: 8px; padding-bottom: 3px; white-space: nowrap; font-family: var(--ui-font-display); font-size: max(10px, 3.6cqw); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: #fbefd6;
  background: linear-gradient(#e3c17f, #e3c17f) 0 100% / 0 1px no-repeat; transition: background-size 500ms var(--hm-ease-out); }
.sx__cta svg { width: 16px; height: 16px; color: #e3c17f; transition: transform var(--ui-dur-slow) var(--hm-ease-out); }
.sx__div { position: absolute; top: 14%; bottom: 2%; right: calc(-0.5 * clamp(24px, 2.4vw, 38px)); width: 1px; pointer-events: none;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, #c39a55 70%, transparent) 6%, color-mix(in srgb, #c39a55 70%, transparent) 94%, transparent); }
.sx__div::before, .sx__div::after { content: '✦'; position: absolute; left: 50%; translate: -50% 0; padding: 2px 0; font-size: 13px; line-height: 1; color: #c39a55; background: var(--st-ivory); }
.sx__div::before { top: 0; } .sx__div::after { bottom: 0; }
.sx__div i { position: absolute; left: -1px; top: 6%; width: 3px; height: 14%; border-radius: 2px; opacity: 0; background: linear-gradient(180deg, transparent, #fff3d6, transparent); box-shadow: 0 0 6px 1px rgba(255, 220, 150, 0.8);
  animation: oc-glint 8s ease-in-out infinite; animation-delay: calc(var(--i) * 2s + 1.2s); animation-play-state: paused; }
.st .oc__gleam { position: absolute; inset: -10% -60%; pointer-events: none; opacity: 0; mix-blend-mode: soft-light; transform: translateX(-40%);
  background: linear-gradient(105deg, transparent 38%, rgba(255, 236, 196, 0.08) 44%, rgba(255, 240, 210, 0.4) 50%, rgba(255, 236, 196, 0.08) 56%, transparent 62%);
  animation: oc-gleam 16s ease-in-out infinite; animation-delay: calc(var(--i) * 4s + 1s); animation-play-state: paused; }
.st.is-live :is(.sx__photo .ph-img, .oc__gleam, .sx__div i, .sx__spark) { animation-play-state: running; }
/* Hover/focus: the window lifts, the photograph draws closer, the call to action underlines. */
.sx:hover, .sx:focus-visible { transform: translateY(-6px); }
.sx:hover .sx__photo .ph-img, .sx:focus-visible .sx__photo .ph-img { transform: scale(1.06); animation-play-state: paused; }
.sx:hover .sx__cta, .sx:focus-visible .sx__cta { background-size: 100% 1px; }
.sx:hover .sx__cta svg, .sx:focus-visible .sx__cta svg { transform: translateX(4px); }
.sx:hover .sx__rim, .sx:focus-visible .sx__rim { stroke: #a87d35; }
.st .sx:hover :is(.oc__gleam, .sx__spark) { animation-play-state: paused; }
.sx:focus-visible { outline: 0; }
.sx:focus-visible .sx__rim { stroke: var(--ui-accent); stroke-width: 2.5; }
@media (prefers-reduced-motion: no-preference) {
  .st:not(.is-in) .sx__item, .st:not(.is-in) .st__head > * { opacity: 0; }
  .st.is-in .sx__item { animation: hm-rise 850ms var(--hm-ease-out) both; animation-delay: calc(240ms + var(--i) * 100ms); }
  .st.is-in .st__head > * { animation: hm-rise 850ms var(--hm-ease-out) both; }
}

/* Tablet: the portrait band beside the heading; the windows swipe, about two and a half in view. */
@media (max-width: 1099px) {
  .st__portrait { width: 52%; bottom: auto; height: clamp(460px, 62vw, 640px); -webkit-mask-image: linear-gradient(90deg, #000 60%, transparent); mask-image: linear-gradient(90deg, #000 60%, transparent); }
  .st__in { padding-left: var(--hm-gutter); }
  .st__top { grid-template-columns: 1fr; margin-left: 42%; min-height: clamp(400px, 56vw, 580px); align-content: center; }
  .st__flora { display: none; }
  .sx-row { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * 22px) / 2.5); gap: 22px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: calc(-1 * var(--hm-gutter)); padding-inline: var(--hm-gutter); scroll-padding-inline: var(--hm-gutter); padding-top: 26px; }
  .sx-row::-webkit-scrollbar { display: none; }
  .sx__item { scroll-snap-align: start; }
  .sx__div { display: none; }
}
/* Phones (owner's mobile reference): portrait left in an S-curve, heading right; windows swipe. */
@media (max-width: 719px) {
  .st { padding-top: 0; }
  .st__portrait { width: 100%; height: clamp(520px, 150vw, 700px); -webkit-mask-image: none; mask-image: none; }
  .st__portrait::after { content: ''; position: absolute; inset: 0; background: var(--st-ivory);
    clip-path: polygon(100% 0, 53% 0, 47% 10%, 44% 24%, 45% 38%, 49% 52%, 56% 64%, 65% 76%, 74% 88%, 80% 100%, 100% 100%); }
  .st__pimg { object-position: 50% 18%; width: 140%; max-width: none; margin-left: -40%; }
  .st__top { margin-left: 46%; min-height: clamp(520px, 150vw, 700px); padding-block: 56px 40px; margin-bottom: 18px; align-content: start; }
  .st__head { gap: 6px; }
  .st__crest i { width: 34px; }
  .st__crest-ic { width: 30px; }
  .st__kicker { font-size: 0.72rem; }
  .st__title { font-size: clamp(2rem, 9.6vw, 2.6rem); }
  .st__rule--m { display: flex; margin-top: 4px; }
  .st__tag { font-size: 0.68rem; letter-spacing: 0.24em; line-height: 2; }
  .st__aside { justify-items: center; margin-top: 18px; }
  .st__note { display: none; }
  .st__cta { justify-self: center; background: var(--ui-accent); border-color: var(--ui-accent); color: #fbf1df; padding: 0 18px 0 22px; font-size: 0.7rem; letter-spacing: 0.18em; }
  .sx-row { grid-auto-columns: 74%; gap: 18px; padding-inline: 13%; scroll-padding-inline: 13%; }
  .sx__item { scroll-snap-align: center; }
  .st__foot { margin-top: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .st :is(.st__pimg, .sx__photo .ph-img, .oc__gleam, .sx__div i, .sx__spark) { animation: none !important; }
  .st .oc__gleam, .sx__div i, .sx__spark { display: none; }
  .sx, .sx__photo .ph-img, .sx__cta, .sx__cta svg, .st__cta, .st__cta svg { transition: none; }
}

/* ── Slot 8 · Dussehra Festive Weaves (owner's banner, 8 Oct 2026; rebuilt to its measurements) ─
   The reference is a 16:9 banner (1672 × 941). Wide screens reproduce it in its own proportions:
   words in the left third from 4.7 %; four pill windows from 48.3 % across, 11.1 % wide each,
   13.6 % from the top and 74.6 % tall; each fabric arch begins 37 % down its window; gold dividers
   with stars between the windows; the hall stays warm and bright, darkened only behind the words.
   Sizes are in units of the banner's width (cqw) so the composition scales as one picture. */
.wv { --wv-cream: #f6e6c6; --wv-gold: #d9b56f; position: relative; isolation: isolate; overflow: hidden; color: var(--wv-cream); background: #2a0d0e; container-type: inline-size; }
.wv__bg { position: absolute; inset: 0; z-index: -3; }
.wv__bgimg { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; animation: st-drift 32s ease-in-out infinite alternate; animation-play-state: paused; }
.wv::before { content: ''; position: absolute; inset: 0; z-index: -2; pointer-events: none;
  background: linear-gradient(90deg, rgba(38, 10, 9, 0.82) 0%, rgba(38, 10, 9, 0.68) 22%, rgba(38, 10, 9, 0.32) 38%, rgba(38, 10, 9, 0.06) 50%, rgba(38, 10, 9, 0) 60%),
    linear-gradient(0deg, rgba(38, 10, 9, 0.35), transparent 22%); }
.wv .st__standin { z-index: 1; }
.wv__petals { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.wv__petals span { position: absolute; top: -40px; left: var(--x); width: var(--s); aspect-ratio: 1.55; border-radius: 85% 6% 85% 6%; opacity: 0;
  background: radial-gradient(ellipse at 30% 35%, #f0627a, #c4173c 58%, #7d0c25); animation: hx-fall var(--d) linear var(--del) infinite; animation-play-state: paused; }
.wv__glow { position: absolute; z-index: -1; left: 0; right: 0; bottom: 0; height: 18%; pointer-events: none;
  background: radial-gradient(5% 60% at 4% 100%, rgba(255, 186, 102, 0.6), transparent), radial-gradient(5% 60% at 97% 96%, rgba(255, 176, 92, 0.55), transparent);
  animation: nc-glow 4.6s ease-in-out infinite alternate; animation-play-state: paused; }
.wv.is-live :is(.wv__bgimg, .wv__petals span, .wv__glow, .wv__win .ph-img, .oc__gleam), .wv.is-live .wv__ring::before { animation-play-state: running; }
/* Gold line art at the lower left (the owner's ornament: lotus, temple and palms), as in the reference. */
.wv__orn { position: absolute; z-index: -1; left: 0.4%; top: 71.5%; width: 26%; height: auto; opacity: 0.82; pointer-events: none; filter: drop-shadow(0 0 10px rgba(29, 7, 9, 0.35)); }

/* The banner frame: 16:9 on wide screens. */
.wv__in { position: relative; width: 100%; aspect-ratio: 1672 / 941; min-height: 620px; }
.wv__head { position: absolute; left: 4.7%; top: 8.6%; width: 38%; display: grid; justify-items: start; text-shadow: 0 2px 14px rgba(29, 7, 9, 0.55); }
.wv__crest { display: flex; align-items: center; gap: 0.65cqw; color: var(--wv-gold); margin-left: 4.7cqw; }
.wv__crest i { display: block; width: 4.2cqw; height: 1px; background: currentColor; opacity: 0.85; }
.wv__crest-ic { width: 2.8cqw; min-width: 28px; height: auto; aspect-ratio: 48 / 40; }
.wv__kicker { margin-top: 1.5cqw; font-family: var(--ui-font-display); font-size: max(12px, 1.2cqw); letter-spacing: 0.42em; text-transform: uppercase; color: var(--wv-cream); white-space: nowrap; }
.wv__title { margin: 1.6cqw 0 0; font-family: var(--hx-serif); font-weight: 400; font-size: max(34px, 4.75cqw); line-height: 1.04; letter-spacing: -0.01em; color: var(--wv-cream); text-shadow: 0 3px 18px rgba(29, 7, 9, 0.5); }
.wv__title span { display: block; }
@media (min-width: 1280px) { .wv__title { white-space: nowrap; } }
.wv__rule { display: flex; align-items: center; gap: 0.5cqw; margin-top: 2cqw; color: var(--wv-gold); }
.wv__rule i { display: block; width: 5.4cqw; height: 1px; background: currentColor; opacity: 0.85; }
.wv__rule .dh__diamond { width: 1.6cqw; min-width: 18px; }
.wv__intro { margin: 1.9cqw 0 0; max-width: 20.5cqw; font-family: var(--hx-serif); font-size: max(15px, 1.32cqw); line-height: 1.55; color: var(--wv-cream); }
.wv__cta { margin-top: 2cqw; display: inline-flex; align-items: center; justify-content: center; gap: 0.8cqw; height: max(44px, 3cqw); padding: 0 1.9cqw; border-radius: 999px; text-decoration: none; text-shadow: none;
  background: #fbf2e2; color: #3b1418; font-family: var(--ui-font-display); font-size: max(11px, 0.98cqw); font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; white-space: nowrap;
  box-shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.6); transition: box-shadow var(--ui-dur-slow) var(--ui-ease), transform var(--ui-dur-fast) var(--ui-ease); }
.wv__cta svg { width: max(16px, 1.2cqw); height: auto; transition: transform var(--ui-dur-slow) var(--hm-ease-out); }
.wv__cta:hover { box-shadow: 0 14px 30px -12px rgba(0, 0, 0, 0.7), 0 0 0 4px rgba(217, 181, 111, 0.3); }
.wv__cta:hover svg { transform: translateX(4px); }
.wv__cta:focus-visible { outline: 2px solid #f1d08f; outline-offset: 4px; }

/* The four windows, placed as in the reference. */
.wv__row { list-style: none; margin: 0; padding: 0; position: absolute; left: 48.3%; right: 2.2%; top: 13.6%; height: 74.6%; display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 1.75cqw; }
.wv__item { position: relative; min-width: 0; height: 100%; }
.wv__card { position: absolute; inset: 0; display: block; container-type: inline-size; border-radius: 999px; overflow: hidden; text-decoration: none; color: inherit;
  background: linear-gradient(180deg, rgba(52, 18, 14, 0.74), rgba(40, 13, 11, 0.62)); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
  box-shadow: 0 22px 40px -26px rgba(0, 0, 0, 0.85); transition: transform 700ms var(--hm-ease-out), box-shadow var(--ui-dur-slow) var(--ui-ease); }
/* The gold outline, with a bead of light circling it, one window after another. */
@property --wv-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.wv__ring { position: absolute; inset: 0; z-index: 3; border-radius: inherit; padding: 1.2px; pointer-events: none;
  overflow: hidden; container-type: size;
  -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
.wv__ring::before { content: ''; position: absolute; left: 50%; top: 50%; width: 150cqmax; aspect-ratio: 1;
  background: conic-gradient(from 0deg, rgba(226, 192, 126, 0.85) 0deg 322deg, #fff4d8 341deg, rgba(226, 192, 126, 0.85) 360deg);
  transform: translate(-50%, -50%) rotate(0deg); animation: wv-ring 11s linear infinite; animation-delay: calc(var(--i) * -2.75s); animation-play-state: paused; }
@keyframes wv-ring { to { transform: translate(-50%, -50%) rotate(360deg); } }
.wv__top { position: absolute; left: 15%; right: 9%; top: 7.1%; display: flex; flex-direction: column; align-items: flex-start; }
.wv__no { font-family: var(--hx-serif); font-size: max(12px, 9.4cqw); line-height: 1; letter-spacing: 0.06em; color: var(--wv-cream); }
.wv__no::after { content: ''; display: block; width: 17cqw; height: 1px; margin-top: 6cqw; background: var(--wv-gold); }
.wv__name { margin-top: 9cqw; font-family: var(--hx-serif); font-weight: 400; font-size: max(17px, 14.6cqw); line-height: 1.05; color: var(--wv-cream); white-space: nowrap; }
.wv__line { margin-top: 7cqw; font-family: var(--ui-font-display); font-size: max(9px, 6.2cqw); letter-spacing: 0.17em; line-height: 1.75; text-transform: uppercase; color: #f0dcb8; }
.wv__go { margin-top: 9cqw; width: 22cqw; height: 22cqw; min-width: 30px; min-height: 30px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(246, 230, 198, 0.8); color: var(--wv-cream);
  transition: background-color var(--ui-dur-base) var(--ui-ease), color var(--ui-dur-base) var(--ui-ease), transform var(--ui-dur-slow) var(--hm-ease-out); }
.wv__go svg { width: 46%; height: 46%; }
.wv__soon { margin-top: 9cqw; padding: 0.4em 0.9em 0.3em; white-space: nowrap; border: 1px dashed rgba(217, 181, 111, 0.75); border-radius: 999px; font-family: var(--ui-font-display); font-size: max(9px, 5.4cqw); letter-spacing: 0.12em; text-transform: uppercase; color: var(--wv-gold); }
/* The fabric opening (reference): one long sweep, high at the right edge (37.2 % down), falling as
   a quarter ellipse to the left edge (53 % down); the pill's round foot closes it. A fine gold line
   follows the sweep. The photograph fills the opening, lamps at its top, fabric below. */
.wv__win { position: absolute; inset: 0; overflow: hidden; clip-path: url(#wv-cut); }
.wv__win .ph-img { inset: auto 0 0 0; top: 33%; height: 67%; object-position: 50% 58%; animation: oc-breathe 18s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -4s); animation-play-state: paused; }
.wv__arc { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.wv__arc path { fill: none; stroke: rgba(230, 197, 132, 0.95); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.wv__arc-m { display: none; }
.wv .oc__gleam { position: absolute; inset: -10% -60%; pointer-events: none; opacity: 0; mix-blend-mode: soft-light; transform: translateX(-40%);
  background: linear-gradient(105deg, transparent 38%, rgba(255, 236, 196, 0.1) 44%, rgba(255, 240, 210, 0.45) 50%, rgba(255, 236, 196, 0.1) 56%, transparent 62%);
  animation: oc-gleam 16s ease-in-out infinite; animation-delay: calc(var(--i) * 4s + 1s); animation-play-state: paused; }
/* Gold dividers with stars at each end, between the windows. */
.wv__div { position: absolute; top: 6.7%; bottom: 3.8%; right: calc(-0.875cqw - 0.5px); width: 1px; pointer-events: none;
  background: linear-gradient(180deg, rgba(217, 181, 111, 0.7), rgba(217, 181, 111, 0.7)); }
.wv__div i { position: absolute; left: 50%; translate: -50% -50%; font-style: normal; font-size: max(11px, 1cqw); line-height: 1; color: var(--wv-gold); text-shadow: 0 0 6px rgba(255, 210, 140, 0.6); }
.wv__div i:first-child { top: 0; } .wv__div i:last-child { top: 100%; }
.wv__card:hover, .wv__card:focus-visible { transform: translateY(-6px); box-shadow: 0 30px 46px -26px rgba(0, 0, 0, 0.9); }
.wv__card:hover .wv__go, .wv__card:focus-visible .wv__go { background: var(--wv-cream); color: #3b1418; transform: translateX(3px); }
.wv .wv__card:hover :is(.ph-img, .oc__gleam), .wv .wv__card:hover .wv__ring::before { animation-play-state: paused; }
.wv__card:focus-visible { outline: 2px solid #f1d08f; outline-offset: 4px; }
@media (prefers-reduced-motion: no-preference) {
  .wv:not(.is-in) .wv__item, .wv:not(.is-in) .wv__head > * { opacity: 0; }
  .wv.is-in .wv__item { animation: hm-rise 900ms var(--hm-ease-out) both; animation-delay: calc(240ms + var(--i) * 110ms); }
  .wv.is-in .wv__head > * { animation: hm-rise 850ms var(--hm-ease-out) both; }
}

/* Tablets: the same banner language stacked: words over the hall, then all four windows in a row. */
@media (max-width: 1279px) {
  .wv__in { aspect-ratio: auto; max-height: none; min-height: 0; padding: 64px var(--hm-gutter) 72px; }
  .wv::before { background: linear-gradient(180deg, rgba(38, 10, 9, 0.78) 0%, rgba(38, 10, 9, 0.55) 40%, rgba(38, 10, 9, 0.25) 70%, rgba(38, 10, 9, 0.45) 100%); }
  .wv__bgimg { object-position: 30% 50%; }
  .wv__head { position: relative; left: auto; top: auto; width: auto; max-width: 560px; }
  .wv__crest { margin-left: 70px; gap: 8px; } .wv__crest i { width: 56px; }
  .wv__kicker { margin-top: 14px; font-size: 0.82rem; }
  .wv__title { margin-top: 14px; font-size: clamp(2.6rem, 6.4vw, 3.6rem); }
  .wv__rule { margin-top: 18px; } .wv__rule i { width: 70px; }
  .wv__intro { margin-top: 16px; font-size: 1.08rem; max-width: 30em; }
  .wv__cta { margin-top: 20px; padding: 0 26px; gap: 10px; font-size: 0.76rem; }
  .wv__row { position: relative; left: auto; right: auto; top: auto; height: auto; margin-top: 44px; column-gap: 22px; }
  .wv__item { height: auto; aspect-ratio: 0.3; }
  .wv__top { top: 6%; }
  .wv__no::after { margin-top: 4.5cqw; }
  .wv__name { margin-top: 7cqw; }
  .wv__line { margin-top: 5.5cqw; }
  .wv__go, .wv__soon { margin-top: 7cqw; }
  .wv__div { right: -11px; }
  .wv__div i { font-size: 12px; }
  .wv__orn { top: 70px; left: auto; right: 2%; width: min(44%, 400px); opacity: 0.6; }
}
/* Phones: words first, then the windows two by two, a little shorter, all four in view. */
@media (max-width: 719px) {
  .wv__in { padding: 56px var(--hm-gutter) 64px; }
  .wv__crest { margin-left: 56px; } .wv__crest i { width: 40px; }
  .wv__kicker { font-size: 0.72rem; letter-spacing: 0.3em; }
  .wv__title { font-size: clamp(2.3rem, 11vw, 3rem); }
  .wv__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; margin-top: 36px; }
  .wv__item { aspect-ratio: 0.41; }
  .wv__item:nth-child(even) { translate: 0 24px; }
  .wv__div { display: none; }
  .wv__win { clip-path: url(#wv-cut-m); }
  .wv__win .ph-img { top: 41%; height: 59%; }
  .wv__arc-d { display: none; } .wv__arc-m { display: inline; }
  .wv__top { top: 8%; left: 14%; }
  .wv__no::after { margin-top: 4cqw; }
  .wv__name { margin-top: 6cqw; font-size: max(17px, 13cqw); }
  .wv__line { margin-top: 4cqw; font-size: max(9px, 5cqw); letter-spacing: 0.1em; line-height: 1.55; }
  .wv__go, .wv__soon { margin-top: 4cqw; }
  .wv__top { top: 7%; }
  .wv__card:hover, .wv__card:focus-visible { transform: none; }
  .wv__in { padding-bottom: calc(46vw + 40px); }
  .wv__orn { top: auto; bottom: 22px; left: 50%; right: auto; translate: -50% 0; width: 88%; opacity: 0.85; }
  .wv::before { background: linear-gradient(180deg, rgba(38, 10, 9, 0.78) 0%, rgba(38, 10, 9, 0.5) 38%, rgba(38, 10, 9, 0.3) 62%, rgba(38, 10, 9, 0.88) 86%, rgba(29, 7, 9, 0.95) 100%); }
}
@media (prefers-reduced-motion: reduce) {
  .wv :is(.wv__bgimg, .wv__petals span, .wv__glow, .wv__win .ph-img, .oc__gleam), .wv .wv__ring::before { animation: none !important; }
  .wv__petals, .wv .oc__gleam { display: none; }
  .wv__card, .wv__go, .wv__cta, .wv__cta svg { transition: none; }
}

/* ── Slot 9 · Only one (permanent) ─────────────────────────────────────────────────────
   Ivory, the approved "Nine, handpicked" header and card (.ep) reused as they are. */
.o1 { position: relative; background: #f8efe2; padding-block: clamp(56px, 6vw, 96px); color: var(--ui-text); }
.o1__in { max-width: 1440px; margin-inline: auto; padding-inline: var(--hm-gutter); }
.o1__all { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-family: var(--ui-font-display); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ui-accent); text-decoration: none; white-space: nowrap; }
.o1__all svg { width: 18px; height: 18px; transition: transform var(--ui-dur-slow) var(--hm-ease-out); }
.o1__all:hover svg { transform: translateX(4px); }
.o1__all:focus-visible { outline: var(--ui-ring-width) solid var(--ui-ring); outline-offset: 3px; }
.o1 .ep > .ep__bag { position: absolute; top: 12px; right: 12px; z-index: 2; width: 42px; height: 42px; border: 0; background: #fffaf3; color: var(--ui-accent); box-shadow: 0 4px 12px rgba(29, 7, 9, 0.25); }
.o1 .ep > .ep__bag svg { width: 20px; height: 20px; }
.o1 .ep > .ep__bag:hover { background: var(--ui-accent); color: #fbf1df; }
.o1 .ep__foot { padding-top: 12px; border-top: 1px solid #ecdfcf; }
.o1 .ep__price { padding-top: 0; border-top: 0; }
@media (max-width: 599px) { .o1__head .ep__aside { flex-direction: row; align-items: center; } }

/* ── Slot 11 · Trust & Service: "Our promises" (redesign approved 9 Oct 2026) ─────────────
   Four arch niches on ivory, each crowned by a gold medallion icon; gold rules with a diamond
   between them (as in Occasions). Phones: medallion left, words right, a rule between rows. */
.tp { --tp-gold: #b08a4a; --tp-gold-hi: #d6b06a; --tp-line: rgba(176, 138, 74, 0.45);
  background: radial-gradient(70% 60% at 50% 0%, #fdf8f0, #fbf4ea 70%); border-top: 1px solid #ecdfcf; padding-block: clamp(56px, 6vw, 96px) clamp(56px, 6vw, 88px); color: var(--ui-text); }
.tp__in { max-width: 1240px; margin-inline: auto; padding-inline: var(--hm-gutter); }
.tp__head { display: grid; justify-items: center; gap: 10px; text-align: center; margin-bottom: clamp(48px, 5vw, 72px); }
.tp__title { margin: 0; font-family: var(--hx-serif); font-weight: 500; font-size: clamp(2.2rem, 3.6vw, 3.4rem); line-height: 1.05; color: var(--ui-accent); text-wrap: balance; }
.tp__rule { color: var(--tp-gold-hi); }
.tp__row { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: clamp(28px, 3.4vw, 52px); }
.tp__row--3 { --n: 3; max-width: 960px; margin-inline: auto; }
.tp__item { position: relative; display: grid; justify-items: center; align-content: start; gap: 10px; padding: 52px clamp(16px, 1.8vw, 28px) 30px; text-align: center;
  border: 1px solid var(--tp-line); border-radius: 50% 50% 16px 16px / 88px 88px 16px 16px;
  background: linear-gradient(180deg, rgba(255, 252, 247, 0.95), rgba(251, 241, 228, 0.9));
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 18px 34px -26px rgba(98, 26, 63, 0.35);
  opacity: 0; transform: translateY(22px);
  transition: opacity 0.7s var(--hm-ease-out) calc(var(--i) * 90ms), transform 0.7s var(--hm-ease-out) calc(var(--i) * 90ms), box-shadow var(--ui-dur-slow) var(--ui-ease), border-color var(--ui-dur-slow) var(--ui-ease); }
.tp__item::before { content: ''; position: absolute; inset: 6px 6px auto; height: 70%; border: 1px solid rgba(176, 138, 74, 0.2); border-bottom: 0; border-radius: 50% 50% 0 0 / 82px 82px 0 0; pointer-events: none; }
/* The rule with its diamond between niches */
.tp__item:not(:last-child)::after { content: ''; position: absolute; top: 34%; right: calc(-0.5 * clamp(28px, 3.4vw, 52px) - 5px); width: 11px; height: 32%; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 11'%3E%3Cpath d='M5.5 1L10 5.5L5.5 10L1 5.5Z' fill='%23fbf4ea' stroke='%23b08a4a' stroke-width='1'/%3E%3C/svg%3E") center / 11px 11px no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 100' preserveAspectRatio='none'%3E%3Cpath d='M5.5 0V100' stroke='%23b08a4a' stroke-opacity='.55' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center / 11px 100% no-repeat; }
.tp__medal { position: absolute; top: -34px; left: 50%; translate: -50% 0; width: 68px; height: 68px; border-radius: 50%; display: grid; place-items: center;
  color: var(--tp-gold); background: radial-gradient(circle at 50% 35%, #fffdf8, #f6ead6); border: 1px solid var(--tp-gold-hi);
  box-shadow: 0 0 0 5px #fbf4ea, 0 0 0 6px var(--tp-line), 0 10px 22px -12px rgba(98, 26, 63, 0.45); }
.tp__ic { width: 36px; height: 36px; }
.tp__ic .tp__a { color: var(--ui-accent); transition: transform var(--ui-dur-slow) var(--ui-ease); transform-box: fill-box; transform-origin: center; }
.tp__ic [pathLength] { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.1s var(--ui-ease) calc(0.25s + var(--i) * 90ms); }
.tp__t { margin: 6px 0 0; font-family: var(--hx-serif); font-weight: 500; font-size: clamp(1.1rem, 1.3vw, 1.3rem); line-height: 1.25; color: var(--ui-accent); text-wrap: balance; }
.tp__d { margin: 0; max-width: 30ch; font-size: 0.9rem; line-height: 1.6; color: #5d4c46; }
.tp__item--season { border-color: rgba(138, 42, 58, 0.55); }
.tp__item--season .tp__medal { border-color: #8a2a3a; box-shadow: 0 0 0 5px #fbf4ea, 0 0 0 6px rgba(138, 42, 58, 0.4), 0 10px 22px -12px rgba(98, 26, 63, 0.45); }
.tp.is-in .tp__item { opacity: 1; transform: none; }
.tp.is-in .tp__ic [pathLength] { stroke-dashoffset: 0; }
@media (hover: hover) {
  .tp__item:hover { border-color: var(--tp-gold-hi); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 24px 40px -24px rgba(98, 26, 63, 0.45); }
  .tp__item:hover .tp__ic .tp__a { transform: translateX(-3px); }
  .tp__item:hover .tp__ic .tp__a--top { transform: translateX(3px); }
  .tp__item:hover .tp__ic .tp__a--bot { transform: translateX(-3px); }
  .tp__item--season:hover .tp__ic .tp__a { transform: translateX(3px); }
}
.tp__more { margin: clamp(40px, 4vw, 56px) 0 0; text-align: center; }
.tp__link { display: inline-flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 26px; border-radius: 999px; border: 1px solid var(--ui-accent); color: var(--ui-accent); text-decoration: none;
  font-family: var(--ui-font-display); font-size: 0.76rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
  transition: background var(--ui-dur-slow) var(--ui-ease), color var(--ui-dur-slow) var(--ui-ease); }
.tp__link svg { width: 18px; height: 18px; transition: transform var(--ui-dur-slow) var(--ui-ease); }
.tp__link:hover, .tp__link:focus-visible { background: var(--ui-accent); color: #fff6f7; }
.tp__link:hover svg, .tp__link:focus-visible svg { transform: translateX(4px); }
.tp__link:focus-visible { outline: 2px solid var(--ui-accent); outline-offset: 3px; }
/* Tablets: two by two */
@media (max-width: 1099px) {
  .tp__row, .tp__row--3 { --n: 2; max-width: 760px; margin-inline: auto; row-gap: 64px; }
  .tp__item:nth-child(2n)::after { display: none; }
}
/* Phones: one column of rows; medallion left, words right; a rule with a diamond between */
@media (max-width: 599px) {
  .tp__row, .tp__row--3 { --n: 1; row-gap: 0; }
  .tp__item { grid-template-columns: 64px minmax(0, 1fr); justify-items: start; text-align: left; column-gap: 16px; row-gap: 4px; padding: 22px 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
  .tp__item::before { display: none; }
  .tp__item:not(:last-child)::after { display: block; top: auto; bottom: -6px; right: auto; left: 0; width: 100%; height: 11px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 10'%3E%3Cpath d='M12 1L15 5L12 9L9 5Z' fill='none' stroke='%23b08a4a' stroke-width='1'/%3E%3C/svg%3E") center / 22px 11px no-repeat,
      linear-gradient(90deg, transparent, var(--tp-line) 12%, var(--tp-line) 42%, transparent 42%, transparent 58%, var(--tp-line) 58%, var(--tp-line) 88%, transparent) center / 100% 1px no-repeat; }
  .tp__medal { position: static; translate: none; grid-row: 1 / span 2; width: 58px; height: 58px; box-shadow: 0 0 0 4px #fbf4ea, 0 0 0 5px var(--tp-line); }
  .tp__item--season .tp__medal { box-shadow: 0 0 0 4px #fbf4ea, 0 0 0 5px rgba(138, 42, 58, 0.4); }
  .tp__ic { width: 30px; height: 30px; }
  .tp__t { margin: 2px 0 0; grid-column: 2; }
  .tp__d { grid-column: 2; max-width: none; }
  .tp__head { margin-bottom: 18px; }
  .tp__link { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .tp__item { opacity: 1; transform: none; transition: none; }
  .tp__ic [pathLength] { stroke-dashoffset: 0; transition: none; }
  .tp__ic .tp__a, .tp__link, .tp__link svg { transition: none; }
}

/* ── Slot 12 · Footer: the shared storefront footer meets the promises directly ───────────── */
.dh-page .sc-footer { margin-top: 0; }

/* ── Slot 3 · Festive Edit, revised (owner's desktop and phone references, 8 Oct 2026) ──────
   The Edit's words over a Dussehra scene; its nine handpicked sarees on the approved
   "Nine, handpicked" card (.ep, unchanged) across the foot of the scene; its four tiles below. */
.fe .fe__scene { position: relative; isolation: isolate; overflow: hidden; color: var(--ed-cream); padding-block: clamp(44px, 5.4vw, 92px) clamp(36px, 3.6vw, 64px); }
.fe__bg { position: absolute; inset: 0; z-index: -2; display: block; }
.fe__bg img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 72% 34%; transform: scale(1.04); transition: transform 2.4s var(--hm-ease-out); }
.fe__scene.is-in .fe__bg img { transform: none; }
.fe__shade { position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(ellipse 60% 70% at 22% 34%, rgba(29, 7, 9, 0.78), rgba(29, 7, 9, 0.35) 60%, rgba(29, 7, 9, 0) 80%),
    linear-gradient(180deg, rgba(29, 7, 9, 0.35) 0%, rgba(29, 7, 9, 0) 30%, rgba(29, 7, 9, 0.55) 62%, #1d0709 100%); }
.fe__standin { left: auto; right: 10px; bottom: auto; top: 10px; }
/* Stand-in only (the current Edit photograph): mirrored so its subject sits on the open side. */
.fe__bg--standin img { transform: scaleX(-1) scale(1.04); }
.fe__scene.is-in .fe__bg--standin img { transform: scaleX(-1); }
.fe__in { max-width: 1440px; margin-inline: auto; padding-inline: var(--hm-gutter); }
.fe .fe__text { position: relative; top: auto; bottom: auto; right: auto; align-content: normal; margin: 0; padding: 0; width: min(100%, 620px); }
.fe__kicker { font-style: normal; font-family: var(--ui-font-display); font-size: clamp(0.78rem, 1vw, 1rem); letter-spacing: 0.42em; padding-left: 0.42em; text-transform: uppercase; }
.fe__rule { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.fe__rule i { width: clamp(48px, 7vw, 96px); height: 1px; background: linear-gradient(90deg, transparent, #d6b06a); }
.fe__rule i:last-child { transform: scaleX(-1); }
.fe__rule b { width: 8px; height: 8px; transform: rotate(45deg); border: 1px solid #f1d08f; }

/* The row: the approved "Nine, handpicked" card (.ep) exactly as before, on the scene; the
   column counts are the card's own (.ep__rail). Only the reveal is added here. */
.fe__row { position: relative; margin-top: clamp(28px, 3.6vw, 52px); }
.fe__slot { opacity: 0; transform: translateY(26px); transition: opacity 0.7s var(--hm-ease-out) calc(var(--i) * 70ms), transform 0.7s var(--hm-ease-out) calc(var(--i) * 70ms); }
.fe__scene.is-in .fe__slot { opacity: 1; transform: none; }
.fe__rail:focus-visible { outline-color: #f1d08f; }
.fe__arrow { position: absolute; z-index: 3; top: 42%; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
  color: #fbf3e6; background: rgba(74, 24, 36, 0.92); border: 1px solid rgba(241, 208, 143, 0.75); box-shadow: 0 8px 20px -8px rgba(0, 0, 0, 0.8); }
.fe__arrow svg { width: 20px; height: 20px; }
.fe__arrow--prev { left: -6px; }
.fe__arrow--next { right: -6px; }
.fe__arrow[hidden] { display: none; }
.fe__arrow:disabled { opacity: 0; pointer-events: none; }
.fe__arrow:focus-visible { outline: 2px solid #f1d08f; outline-offset: 3px; }
.fe__dots { display: flex; justify-content: center; gap: 0; margin-top: 4px; }
.fe__dots[hidden] { display: none; }
.fe__dot { width: 24px; height: 24px; display: grid; place-items: center; border: 0; background: none; cursor: pointer; padding: 0; }
.fe__dot::before { content: ''; width: 7px; height: 7px; border-radius: 50%; border: 1px solid #d6b06a; transition: background var(--ui-dur) var(--ui-ease), transform var(--ui-dur) var(--ui-ease); }
.fe__dot[aria-current='true']::before { background: #f1d08f; transform: scale(1.15); }
.fe__dot:focus-visible { outline: 2px solid #f1d08f; outline-offset: 1px; border-radius: 50%; }

/* Desktop: the words on the left over the dark of the scene, nine across below */
@media (min-width: 1100px) {
  .fe .fe__text { justify-items: center; text-align: center; margin-left: clamp(0px, 3vw, 64px); width: min(44%, 600px); }
}
/* Fewer across as the screen narrows; the row swipes and the arrows appear */
@media (max-width: 1099px) {
  .fe .fe__text { margin-inline: auto; justify-items: center; text-align: center; }
  .fe__shade { background: linear-gradient(180deg, rgba(29, 7, 9, 0.72) 0%, rgba(29, 7, 9, 0.45) 40%, rgba(29, 7, 9, 0.6) 66%, #1d0709 100%); }
}
/* Portrait screens (owner's phone reference; the portrait scene, 9 Oct 2026): the scene at full
   width on top, the words and cards over its dark lower part, which the image leaves empty for them. */
@media (max-width: 599px), (max-width: 1099px) and (orientation: portrait) {
  .fe .fe__scene { padding-top: 56vw; }
  .fe__bg { inset: 0 0 auto 0; aspect-ratio: 2 / 3; }
  .fe__bg img { object-position: 50% 0; }
  .fe__bg::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 30%; background: linear-gradient(180deg, rgba(29, 7, 9, 0), #1d0709); }
  .fe__shade { background: linear-gradient(180deg, rgba(29, 7, 9, 0) 0%, rgba(29, 7, 9, 0) 26%, rgba(29, 7, 9, 0.55) 40%, rgba(29, 7, 9, 0.35) 100%); }
}
/* Phone: two cards in view */
@media (max-width: 599px) {
  .fe__arrow--prev { display: none; }
  .fe__arrow--next { right: -4px; width: 38px; height: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  .fe__slot { opacity: 1; transform: none; transition: none; }
  .fe__bg img { transform: none; transition: none; }
  .fe__bg--standin img, .fe__scene.is-in .fe__bg--standin img { transform: scaleX(-1); }
}
