/* =========================================================================
   REGAL JEWELS SCHAUMBURG — Design system + homepage styles
   -------------------------------------------------------------------------
   ELEMENTOR MAPPING NOTES
   - :root tokens  → Site Settings > Global Colors / Global Fonts
   - .rj-section   → Outer Container (Full Width), padding = --space-section
   - .rj-container → Inner Container (Boxed, 1320px content width)
   - .rj-row / .rj-col → Flex containers (Direction: row / column)
   - .rj-grid-*    → Grid containers (Elementor free supports Grid)
   - Widgets used: Heading, Text Editor, Image, Button, Icon List, Divider,
     Spacer, Shortcode (forms). No Pro-only widgets.
   ========================================================================= */

/* ---------- 0. FONTS (self-hosted, latin subset; SIL Open Font License) ----------
   Fallback faces are scaled to match the web fonts' widths and heights so text
   doesn't jump when the web font finishes loading. */
@font-face { font-family: "Cormorant Garamond"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url("../fonts/cormorant-garamond-latin.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Garamond"; font-style: italic; font-weight: 300 700; font-display: swap;
  src: url("../fonts/cormorant-garamond-italic-latin.woff2") format("woff2"); }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 200 800; font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2"); }
@font-face { font-family: "Cormorant Fallback"; src: local("Times New Roman"), local("TimesNewRomanPSMT");
  size-adjust: 95.8%; ascent-override: 96%; descent-override: 30%; line-gap-override: 0%; }
@font-face { font-family: "Manrope Fallback"; src: local("Arial"), local("ArialMT");
  size-adjust: 100.7%; ascent-override: 106%; descent-override: 30%; line-gap-override: 0%; }

/* ---------- 1. TOKENS ---------- */
:root {
  /* Global Colors */
  --c-ivory: #FAF7F2;      /* page background */
  --c-cream: #F3EDE3;      /* alt section bg */
  --c-champagne: #EAE0CF;  /* warm panels */
  --c-beige: #D8C9B0;      /* borders on warm panels */
  --c-white: #FFFFFF;
  --c-charcoal: #1C1A17;   /* headings, primary buttons, dark section */
  --c-ink: #3A3631;        /* body text */
  --c-muted: #6B645A;      /* secondary text — AA on ivory */
  --c-gold: #8B6B3A;       /* accent text (eyebrows, links) — AA on ivory */
  --c-gold-soft: #C2A26B;  /* hairlines, accents on dark */
  --c-line: rgba(28, 26, 23, 0.14);
  --c-line-dark: rgba(250, 247, 242, 0.18);

  /* Global Fonts */
  --f-serif: "Cormorant Garamond", "Cormorant Fallback", "Times New Roman", serif;
  --f-sans: "Manrope", "Manrope Fallback", Arial, sans-serif;

  /* Type scale (fluid) */
  --t-display: clamp(2.65rem, 6.2vw, 5.4rem);
  --t-h2: clamp(2.15rem, 4.4vw, 3.8rem);
  --t-h3: clamp(1.5rem, 2.2vw, 1.95rem);
  --t-lead: clamp(1.05rem, 1.35vw, 1.2rem);
  --t-body: 1rem;
  --t-small: 0.875rem;
  --t-eyebrow: 0.75rem;

  /* Spacing */
  --space-section: clamp(4rem, 8.5vw, 7.5rem);
  --gutter: clamp(1rem, 4vw, 3rem);
  --container: 1320px;
  --header-h: 72px;

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ---------- 2. BASE ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
body {
  margin: 0;
  background: var(--c-ivory);
  color: var(--c-ink);
  font-family: var(--f-sans);
  font-size: var(--t-body);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
a[href^="tel:"] { white-space: nowrap; }
h1, h2, h3, h4 {
  font-family: var(--f-serif);
  font-weight: 500;
  color: var(--c-charcoal);
  margin: 0;
  letter-spacing: -0.01em;
}
h1 { font-size: var(--t-display); line-height: 1.02; }
h2 { font-size: var(--t-h2); line-height: 1.08; }
h3 { font-size: var(--t-h3); line-height: 1.15; }
h1, h2, h3 { text-wrap: balance; }
h1 em, h2 em { font-style: italic; font-weight: 400; }
p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }
ul { margin: 0; padding: 0; list-style: none; }

:focus-visible { outline: 2px solid var(--c-gold); outline-offset: 3px; }
.rj-skip {
  position: absolute; left: 1rem; top: -100px; z-index: 200;
  background: var(--c-charcoal); color: var(--c-ivory); padding: .75rem 1rem; text-decoration: none;
}
.rj-skip:focus { top: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- 3. LAYOUT PRIMITIVES (= Elementor containers) ---------- */
/* Gold text on warm panels uses a deeper gold to keep WCAG AA contrast (5.07:1 on champagne). */
.rj-section--cream, .rj-section--champagne, .rj-bridal__panel { --c-gold: #735830; }
.rj-section { padding-block: var(--space-section); position: relative; }
.rj-section--cream { background: var(--c-cream); }
.rj-section--champagne { background: var(--c-champagne); }
.rj-section--dark { background: var(--c-charcoal); color: rgba(250, 247, 242, .82); }
.rj-section--dark h2, .rj-section--dark h3 { color: var(--c-ivory); }
.rj-container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.rj-row { display: flex; flex-direction: column; gap: clamp(2rem, 5vw, 5rem); }
.rj-col { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.rj-head { max-width: 46rem; display: flex; flex-direction: column; gap: 1.1rem; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.rj-head--center { margin-inline: auto; text-align: center; align-items: center; }
.rj-head--split { max-width: none; }
@media (min-width: 1024px) {
  .rj-row { flex-direction: row; align-items: center; }
  .rj-row--top { align-items: flex-start; }
  .rj-row > .rj-col { flex: 1 1 0; }
  .rj-head--split { flex-direction: row; justify-content: space-between; align-items: flex-end; }
  .rj-head--split > div { max-width: 40rem; display: flex; flex-direction: column; gap: 1.1rem; }
}

/* ---------- 4. TYPOGRAPHY HELPERS ---------- */
.rj-eyebrow {
  font-family: var(--f-sans); font-size: var(--t-eyebrow); font-weight: 600;
  letter-spacing: .22em; text-transform: uppercase; color: var(--c-gold); margin: 0;
}
.rj-section--dark .rj-eyebrow { color: var(--c-gold-soft); }
.rj-lead { font-size: var(--t-lead); line-height: 1.65; color: var(--c-ink); max-width: 38rem; }
.rj-section--dark .rj-lead { color: rgba(250, 247, 242, .82); }
.rj-muted { color: var(--c-muted); }

/* Placeholder marker — anything the client still needs to confirm */
.rj-ph {
  background: rgba(194, 162, 107, .18);
  border-bottom: 1px dashed var(--c-gold);
  padding: 0 .25em; font-style: normal; white-space: nowrap;
}
.rj-section--dark .rj-ph { background: rgba(194, 162, 107, .22); color: var(--c-ivory); }

/* Ornament divider (jaali-inspired) — use sparingly */
.rj-ornament { display: flex; align-items: center; gap: .9rem; color: var(--c-gold-soft); width: 9rem; }
.rj-ornament::before, .rj-ornament::after { content: ""; flex: 1; height: 1px; background: currentColor; opacity: .7; }
.rj-ornament svg { width: 14px; height: 14px; flex: none; }
.rj-head--center .rj-ornament { margin-inline: auto; }

/* ---------- 5. BUTTONS & LINKS (= Elementor Button widget) ---------- */
.rj-btns { display: flex; flex-wrap: wrap; gap: .75rem 1rem; align-items: center; margin-top: .75rem; }
.rj-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  min-height: 52px; padding: .95rem 1.9rem;
  font-family: var(--f-sans); font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  text-decoration: none; border: 1px solid var(--c-charcoal); border-radius: 0; cursor: pointer;
  transition: background-color .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease);
}
.rj-btn--primary { background: var(--c-charcoal); color: var(--c-ivory); }
.rj-btn--primary:hover { background: transparent; color: var(--c-charcoal); }
.rj-btn--outline { background: transparent; color: var(--c-charcoal); }
.rj-btn--outline:hover { background: var(--c-charcoal); color: var(--c-ivory); }
.rj-btn--light { background: var(--c-ivory); color: var(--c-charcoal); border-color: var(--c-ivory); }
.rj-btn--light:hover { background: transparent; color: var(--c-ivory); }
.rj-btn--ghost-light { background: transparent; color: var(--c-ivory); border-color: rgba(250, 247, 242, .5); }
.rj-btn--ghost-light:hover { border-color: var(--c-ivory); background: var(--c-ivory); color: var(--c-charcoal); }
.rj-btn svg { width: 16px; height: 16px; }

.rj-link {
  display: inline-flex; align-items: center; gap: .55rem;
  font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  text-decoration: none; color: var(--c-charcoal); min-height: 44px; padding-block: .4rem; margin-block: -.35rem;
  background: linear-gradient(var(--c-gold), var(--c-gold)) 0 calc(50% + .95em) / 100% 1px no-repeat;
  transition: background-size .4s var(--ease);
}
.rj-link:hover { background-size: 40% 1px; }
.rj-link::after { content: "→"; font-weight: 400; letter-spacing: 0; transition: transform .35s var(--ease); }
.rj-link:hover::after { transform: translateX(4px); }
.rj-section--dark .rj-link { color: var(--c-ivory); background-image: linear-gradient(var(--c-gold-soft), var(--c-gold-soft)); }

/* ---------- 6. MEDIA (= Elementor Image widget) ---------- */
.rj-media { position: relative; overflow: hidden; background: var(--c-champagne); margin: 0; }
.rj-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.rj-media--4x5 { aspect-ratio: 4 / 5; }
.rj-media--3x4 { aspect-ratio: 3 / 4; }
.rj-media--1x1 { aspect-ratio: 1 / 1; }
.rj-media--3x2 { aspect-ratio: 3 / 2; }
.rj-media--16x10 { aspect-ratio: 16 / 10; }
.rj-caption { font-size: var(--t-small); color: var(--c-muted); margin-top: .75rem; }

/* ---------- 7. HEADER ---------- */
.rj-topbar { display: none; background: var(--c-charcoal); color: rgba(250, 247, 242, .78); font-size: .78rem; letter-spacing: .04em; }
.rj-topbar .rj-container { display: flex; justify-content: space-between; align-items: center; min-height: 38px; gap: 2rem; }
.rj-topbar a { text-decoration: none; }
.rj-topbar a:hover { color: var(--c-ivory); }
.rj-topbar ul { display: flex; gap: 1.75rem; }
.rj-topbar .rj-ph { background: rgba(194, 162, 107, .22); }

.rj-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(250, 247, 242, .94);
  -webkit-backdrop-filter: saturate(140%) blur(10px); backdrop-filter: saturate(140%) blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.rj-header.is-scrolled { border-bottom-color: var(--c-line); }
.rj-header__inner { display: flex; align-items: center; justify-content: space-between; height: var(--header-h); gap: 1.5rem; transition: height .3s var(--ease); }

.rj-logo { display: inline-flex; flex-direction: column; line-height: 1; text-decoration: none; color: var(--c-charcoal); }
.rj-logo__name { font-family: var(--f-serif); font-size: 1.7rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.rj-logo__loc { font-size: .6875rem; font-weight: 600; letter-spacing: .32em; text-transform: uppercase; color: var(--c-gold); margin-top: .35rem; padding-left: .1em; }

.rj-nav { display: none; }
.rj-nav__list { display: flex; align-items: center; gap: clamp(1.1rem, 2.6vw - 1rem, 2.25rem); }
.rj-nav__link {
  display: inline-flex; align-items: center; gap: .35rem; min-height: 44px;
  background: none; border: 0; padding: 0; cursor: pointer; color: var(--c-charcoal);
  font: 500 .82rem/1 var(--f-sans); letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
  position: relative;
}
.rj-nav__link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 8px; height: 1px; background: var(--c-gold);
  transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease);
}
.rj-nav__link:hover::after, .rj-nav__link[aria-current="page"]::after, .rj-nav__link.is-active::after { transform: scaleX(1); }
.rj-nav__link svg { width: 10px; height: 10px; transition: transform .3s var(--ease); }

.rj-dropdown { position: relative; }
.rj-dropdown__panel {
  position: absolute; top: calc(100% + 14px); left: -1.5rem; min-width: 250px;
  background: var(--c-ivory); border: 1px solid var(--c-line); padding: 1rem 0;
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
}
.rj-dropdown__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; } /* hover bridge */
.rj-dropdown.is-open .rj-dropdown__panel,
.no-js .rj-dropdown:hover .rj-dropdown__panel,
.no-js .rj-dropdown:focus-within .rj-dropdown__panel { opacity: 1; visibility: visible; transform: none; }
.rj-dropdown.is-open .rj-dropdown__panel { transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s; } /* focusable immediately */
.rj-dropdown.is-open .rj-nav__link svg { transform: rotate(180deg); }
.rj-dropdown__panel a { display: block; padding: .6rem 1.5rem; text-decoration: none; font-size: .95rem; color: var(--c-ink); }
.rj-dropdown__panel a:hover { color: var(--c-charcoal); background: var(--c-cream); }
.rj-dropdown__panel a.rj-dropdown__all { margin-top: .5rem; padding-top: .9rem; border-top: 1px solid var(--c-line); font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-gold); }

.rj-header__actions { display: flex; align-items: center; gap: .5rem; }
.rj-header__phone { display: none; align-items: center; gap: .5rem; text-decoration: none; font-size: .85rem; font-weight: 500; letter-spacing: .04em; color: var(--c-charcoal); padding: .5rem .75rem; }
.rj-header__phone svg { width: 16px; height: 16px; color: var(--c-gold); }
.rj-header .rj-btn { min-height: 44px; padding: .7rem 1.25rem; font-size: .72rem; display: none; }

.rj-iconbtn {
  display: inline-grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--c-line);
  background: transparent; color: var(--c-charcoal); cursor: pointer; text-decoration: none;
}
.rj-iconbtn svg { width: 18px; height: 18px; }

/* Mobile drawer */
.rj-drawer {
  position: fixed; inset: var(--header-h) 0 0 0; z-index: 99; background: var(--c-ivory);
  padding: 2rem var(--gutter) 7rem; overflow-y: auto;
  opacity: 0; visibility: hidden; transform: translateY(-8px);
  transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}
.rj-drawer.is-open { opacity: 1; visibility: visible; transform: none; transition: opacity .3s var(--ease), transform .3s var(--ease), visibility 0s; } /* focusable immediately */
body.nav-open { overflow: hidden; }

@media (min-width: 640px) { .rj-header .rj-btn { display: inline-flex; } }
@media (min-width: 1024px) {
  :root { --header-h: 84px; }
  .rj-topbar { display: block; }
  .rj-nav { display: block; }
  .rj-menu-toggle, .rj-header__call { display: none; }
  .rj-drawer { display: none; }
  .rj-header.is-scrolled .rj-header__inner { height: 68px; }
}
/* header items never wrap; tighter spacing where the full menu first appears */
.rj-logo__name, .rj-nav__link, .rj-header .rj-btn, .rj-header__phone { white-space: nowrap; }
@media (min-width: 1024px) and (max-width: 1279px) {
  .rj-header__inner { gap: 1rem; }
  .rj-logo__name { font-size: 1.4rem; letter-spacing: .04em; }
  .rj-logo__loc { letter-spacing: .26em; }
  .rj-nav__list { gap: .95rem; }
  .rj-nav__link { font-size: .74rem; letter-spacing: .08em; }
  .rj-header .rj-btn { padding-inline: .9rem; font-size: .66rem; letter-spacing: .1em; }
}
@media (min-width: 1280px) { .rj-header__phone { display: inline-flex; } }

/* Mobile action bar (Call / Directions / Book) */
.rj-actionbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 98;
  display: grid; grid-template-columns: repeat(3, 1fr);
  background: var(--c-charcoal); padding-bottom: env(safe-area-inset-bottom);
}
.rj-actionbar a {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem;
  min-height: 60px; color: var(--c-ivory); text-decoration: none;
  font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
}
.rj-actionbar a + a { border-left: 1px solid var(--c-line-dark); }
.rj-actionbar svg { width: 18px; height: 18px; color: var(--c-gold-soft); }
body { padding-bottom: 60px; }
@media (min-width: 768px) { .rj-actionbar { display: none; } body { padding-bottom: 0; } }

/* ---------- 8. HERO ---------- */
.rj-hero { padding: 0; background: var(--c-ivory); }
.rj-hero__grid { display: flex; flex-direction: column; }
.rj-hero__media { order: -1; aspect-ratio: 3 / 2; max-height: 40svh; width: 100%; } /* image first on mobile (Elementor: Order = Start on tablet/mobile) */
.rj-hero__media img { object-position: 50% 22%; }
.rj-hero__content { padding: 1.75rem var(--gutter) 3rem; display: flex; flex-direction: column; gap: 1.1rem; }
.rj-hero h1 { font-size: clamp(2.35rem, min(4.3vw, 7.4vh), 4.6rem); line-height: 1.04; }
.rj-hero .rj-eyebrow span { display: block; }
@media (max-width: 639px) {
  .rj-hero__content { gap: .85rem; padding-top: 1.5rem; }
  .rj-hero h1 { font-size: clamp(2.2rem, 9.6vw, 2.6rem); }
  .rj-hero .rj-lead { font-size: 1rem; line-height: 1.6; }
}
@media (min-width: 1280px) {
  .rj-hero .rj-eyebrow span { display: inline; }
  .rj-hero .rj-eyebrow .rj-eyebrow__loc::before { content: " · "; }
}
.rj-hero h1 span { display: block; }
.rj-hero .rj-lead { max-width: 30rem; }
.rj-hero__trust { display: flex; align-items: center; gap: .9rem; margin-top: .5rem; padding-top: 1.25rem; border-top: 1px solid var(--c-line); font-size: var(--t-small); color: var(--c-muted); max-width: 30rem; }
.rj-hero__trust svg { flex: none; width: 34px; height: 34px; color: var(--c-gold); }
@media (min-width: 1024px) {
  .rj-hero__grid { flex-direction: row; min-height: calc(100svh - var(--header-h) - 38px); }
  .rj-hero__content { flex: 0 0 48%; justify-content: center; padding: 2.75rem 4vw 3rem max(var(--gutter), calc((100vw - var(--container)) / 2)); }
  .rj-hero__media { order: 0; flex: 1; aspect-ratio: auto; max-height: none; }
}

/* ---------- 9. HERITAGE ---------- */
.rj-heritage__media { position: relative; }
.rj-heritage__media .rj-media--inset { position: absolute; width: 42%; right: -6%; bottom: -10%; border: 10px solid var(--c-ivory); display: none; }
.rj-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-block: 1.25rem .5rem; padding-block: 1.5rem; border-block: 1px solid var(--c-line); }
.rj-stat__value { font-family: var(--f-serif); font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.1; color: var(--c-charcoal); }
.rj-stat__label { font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); margin-top: .35rem; }
@media (min-width: 1024px) {
  .rj-heritage__media { flex: 0 0 46% !important; }
  .rj-heritage__media .rj-media--inset { display: block; }
  .rj-heritage .rj-col--text { padding-left: 3vw; }
}

/* ---------- 10. COLLECTIONS ---------- */
.rj-grid-collections { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 1rem; }
.rj-card { display: flex; flex-direction: column; gap: 1rem; text-decoration: none; color: inherit; }
.rj-card:hover .rj-media img { transform: scale(1.04); }
.rj-card__title { font-size: clamp(1.6rem, 2.2vw, 2rem); }
.rj-card__text { color: var(--c-muted); font-size: .95rem; margin: 0; }
.rj-card .rj-link { align-self: flex-start; }
@media (max-width: 639px) {
  .rj-card { gap: .6rem; }
  .rj-card__title { font-size: 1.3rem; }
  .rj-card__text { font-size: .85rem; line-height: 1.5; }
  .rj-card .rj-link { font-size: .68rem; letter-spacing: .12em; }
}
@media (min-width: 640px) { .rj-grid-collections { gap: 2.5rem 1.5rem; } }
@media (min-width: 1100px) {
  .rj-grid-collections { grid-template-columns: repeat(4, 1fr); }
  .rj-grid-collections .rj-card:nth-child(even) { margin-top: 4rem; }
}

/* ---------- 11. 22KT GOLD FEATURE ---------- */
.rj-points { display: grid; grid-template-columns: 1fr; gap: 0; margin-block: 1rem; border-top: 1px solid var(--c-beige); }
.rj-point { padding: 1.25rem 0; border-bottom: 1px solid var(--c-beige); display: grid; grid-template-columns: 2.5rem 1fr; gap: .25rem 1rem; }
.rj-point__num { font-family: var(--f-serif); font-size: 1.1rem; color: var(--c-gold); grid-row: span 2; padding-top: .1rem; }
.rj-point h3 { font-size: 1.35rem; }
.rj-point p { margin: 0; font-size: .95rem; color: var(--c-ink); }
@media (min-width: 640px) { .rj-points { grid-template-columns: 1fr 1fr; column-gap: 2rem; } }
@media (min-width: 1024px) { .rj-gold__media { flex: 0 0 44% !important; } }
.rj-gold__media .rj-media { aspect-ratio: 4 / 5; }

/* ---------- 12. DIAMONDS ---------- */
.rj-diamonds__mosaic { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1rem; }
.rj-diamonds__mosaic .rj-media:first-child { grid-row: span 2; aspect-ratio: auto; height: 100%; min-height: 100%; }
.rj-diamonds__mosaic .rj-media { aspect-ratio: 1 / 1; }
.rj-taglist { display: flex; flex-wrap: wrap; gap: .5rem; margin-block: .75rem 1rem; }
.rj-taglist a {
  display: inline-flex; align-items: center; min-height: 44px; padding: .5rem .85rem;
  border: 1px solid var(--c-line-dark); color: var(--c-ivory); text-decoration: none;
  font-size: .8rem; letter-spacing: .04em; transition: border-color .3s, background-color .3s, color .3s;
}
.rj-taglist a:hover { border-color: var(--c-gold-soft); background: rgba(194, 162, 107, .1); }
@media (min-width: 1024px) { .rj-diamonds__mosaic { flex: 0 0 52% !important; } }

/* ---------- 13. BRIDAL ---------- */
.rj-bridal { padding-bottom: 0; }
.rj-bridal__hero { display: flex; flex-direction: column; }
.rj-bridal__image { aspect-ratio: 4 / 5; max-height: 80svh; width: 100%; }
.rj-bridal__image img { object-position: 50% 25%; }
.rj-bridal__panel { background: var(--c-champagne); padding: clamp(2.5rem, 6vw, 5.5rem) var(--gutter); display: flex; flex-direction: column; gap: 1.25rem; justify-content: center; }
.rj-bridal__cats { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.5rem; margin-block: .75rem 1rem; border-top: 1px solid var(--c-beige); }
.rj-bridal__cats li { border-bottom: 1px solid var(--c-beige); }
.rj-bridal__cats a { display: flex; align-items: baseline; gap: .75rem; padding: .9rem 0; text-decoration: none; font-family: var(--f-serif); font-size: 1.3rem; color: var(--c-charcoal); transition: color .3s, padding .3s var(--ease); }
.rj-bridal__cats a span { font-family: var(--f-sans); font-size: .7rem; color: var(--c-gold); letter-spacing: .1em; }
.rj-bridal__cats a:hover { padding-left: .35rem; color: var(--c-gold); }
.rj-bridal__strip { display: none; grid-template-columns: repeat(3, 1fr); gap: .5rem; padding-top: .5rem; }
@media (min-width: 768px) { .rj-bridal__strip { display: grid; } }
.rj-bridal__strip .rj-media { aspect-ratio: 3 / 4; }
@media (min-width: 1024px) {
  .rj-bridal__hero { flex-direction: row; }
  .rj-bridal__image { flex: 0 0 50%; max-height: none; aspect-ratio: auto; min-height: 92svh; }
  .rj-bridal__panel { flex: 1; padding-left: clamp(3rem, 6vw, 6.5rem); padding-right: max(var(--gutter), calc((100vw - var(--container)) / 2)); }
}

/* ---------- 14. WHY REGAL ---------- */
.rj-grid-why { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 1.25rem; border-top: 1px solid var(--c-line); }
.rj-why { padding: 2rem 0; border-bottom: 1px solid var(--c-line); display: flex; flex-direction: column; gap: .75rem; }
.rj-why svg { width: 30px; height: 30px; color: var(--c-gold); }
.rj-why h3 { font-size: 1.45rem; }
.rj-why p { color: var(--c-muted); font-size: .95rem; margin: 0; }
@media (max-width: 639px) {
  .rj-why { padding: 1.5rem 0; gap: .5rem; }
  .rj-why h3 { font-size: 1.2rem; }
  .rj-why p { font-size: .85rem; line-height: 1.55; }
  .rj-why:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (min-width: 640px) { .rj-grid-why { column-gap: 2.5rem; } }
@media (min-width: 1100px) {
  .rj-grid-why { grid-template-columns: repeat(5, 1fr); column-gap: 0; border-bottom: 1px solid var(--c-line); }
  .rj-why { padding: 2.5rem 1.75rem 2.75rem; border-bottom: 0; }
  .rj-why + .rj-why { border-left: 1px solid var(--c-line); }
  .rj-why:first-child { padding-left: 0; }
}

/* ---------- 15. VISIT / STORE ---------- */
.rj-visit__media { position: relative; }
.rj-visit__card { background: var(--c-white); border: 1px solid var(--c-line); padding: clamp(1.75rem, 4vw, 3rem); display: flex; flex-direction: column; gap: 1.5rem; }
.rj-info { display: grid; gap: 1.25rem; }
.rj-info__item { display: grid; grid-template-columns: 1.75rem 1fr; gap: 1rem; align-items: start; }
.rj-info__item svg { width: 20px; height: 20px; color: var(--c-gold); margin-top: .2rem; }
.rj-info__label { font-size: .7rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); }
.rj-info__value { font-size: 1.05rem; color: var(--c-charcoal); }
.rj-info__value a { text-decoration: none; display: inline-block; padding-block: .6rem; margin-block: -.6rem; }
.rj-info__value a:hover { color: var(--c-gold); }
.rj-hours { display: grid; grid-template-columns: auto 1fr; gap: .15rem 1.5rem; font-size: .95rem; }
.rj-hours > span:first-child { white-space: nowrap; }
.rj-visit__card .rj-btns { margin-top: 0; }
.rj-visit__card .rj-btn { flex: 1 1 auto; }
@media (min-width: 1024px) {
  .rj-visit__media { flex: 0 0 50% !important; }
  .rj-visit__card { margin-left: -6rem; position: relative; z-index: 2; }
}

/* ---------- 16. TESTIMONIALS (placeholder) ---------- */
.rj-grid-quotes { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.rj-quote { border: 1px dashed var(--c-beige); padding: 2.25rem 2rem; display: flex; flex-direction: column; gap: 1.25rem; background: rgba(255, 255, 255, .35); }
.rj-quote__mark { font-family: var(--f-serif); font-size: 3.5rem; line-height: .5; color: var(--c-gold-soft); height: 1.25rem; }
.rj-quote blockquote { margin: 0; font-family: var(--f-serif); font-size: 1.35rem; line-height: 1.45; color: var(--c-muted); font-style: italic; }
.rj-quote figcaption { font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }
.rj-dev-note { display: inline-block; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-gold); border: 1px dashed var(--c-gold); padding: .4rem .8rem; }
@media (min-width: 768px) { .rj-grid-quotes { grid-template-columns: repeat(3, 1fr); } }

/* ---------- 17. FAQ (AI-search / GEO) ---------- */
.rj-faq { border-top: 1px solid var(--c-line); }
.rj-faq details { border-bottom: 1px solid var(--c-line); }
.rj-faq summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1.5rem;
  padding: 1.5rem 0; font-family: var(--f-serif); font-size: clamp(1.25rem, 1.8vw, 1.55rem); color: var(--c-charcoal); line-height: 1.3;
}
.rj-faq summary::-webkit-details-marker { display: none; }
.rj-faq summary::after { content: "+"; font-family: var(--f-sans); font-weight: 300; font-size: 1.6rem; color: var(--c-gold); transition: transform .3s var(--ease); flex: none; }
.rj-faq details[open] summary::after { transform: rotate(45deg); }
.rj-faq__answer { padding: 0 0 1.75rem; max-width: 46rem; color: var(--c-ink); }
@media (min-width: 1024px) { .rj-faq-wrap .rj-col:first-child { flex: 0 0 34% !important; position: sticky; top: calc(var(--header-h) + 2rem); } }

/* ---------- 18. JOURNAL ---------- */
.rj-grid-journal { display: grid; grid-template-columns: 1fr; gap: 3rem 2rem; }
.rj-post { display: flex; flex-direction: column; gap: .9rem; text-decoration: none; color: inherit; }
.rj-post:hover .rj-media img { transform: scale(1.04); }
.rj-post__meta { font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-gold); }
.rj-post h3 { font-size: clamp(1.45rem, 2vw, 1.75rem); }
.rj-post p { color: var(--c-muted); font-size: .95rem; margin: 0; }
@media (min-width: 768px) { .rj-grid-journal { grid-template-columns: repeat(3, 1fr); } }

/* ---------- 19. FINAL CTA + INQUIRY ---------- */
.rj-final { position: relative; overflow: hidden; }
.rj-final__bg { position: absolute; inset: 0; z-index: 0; }
.rj-final__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .38; }
.rj-final__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--c-charcoal) 15%, rgba(28, 26, 23, .55)); }
.rj-final .rj-container { position: relative; z-index: 1; }
.rj-final h2 { max-width: 12ch; }
.rj-form { background: var(--c-ivory); color: var(--c-ink); padding: clamp(1.75rem, 4vw, 3rem); display: grid; gap: 1.1rem; }
.rj-section--dark .rj-form h3, .rj-form h3 { font-size: 1.75rem; color: var(--c-charcoal); }
.rj-form__row { display: grid; gap: 1.1rem; }
@media (min-width: 640px) { .rj-form__row { grid-template-columns: 1fr 1fr; } }
.rj-field { display: grid; gap: .4rem; }
.rj-field label { font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-ink); }
.rj-field input, .rj-field select, .rj-field textarea {
  width: 100%; font: 400 1rem/1.4 var(--f-sans); color: var(--c-charcoal);
  background: var(--c-white); border: 1px solid var(--c-line); border-radius: 0; padding: .85rem 1rem; min-height: 50px;
  transition: border-color .25s;
}
.rj-field textarea { min-height: 110px; resize: vertical; }
.rj-field input:focus, .rj-field select:focus, .rj-field textarea:focus { outline: none; border-color: var(--c-gold); box-shadow: 0 0 0 3px rgba(194, 162, 107, .25); }
.rj-form .rj-btn { width: 100%; }
.rj-form__note { font-size: .8rem; color: var(--c-muted); margin: 0; }
.rj-form__status { font-size: .9rem; color: var(--c-gold); margin: 0; min-height: 1.2em; }
@media (min-width: 1024px) { .rj-final .rj-col--form { flex: 0 0 46% !important; } }

/* ---------- 20. FOOTER ---------- */
.rj-footer { border-top: 1px solid rgba(194, 162, 107, .3); background: #151311; color: rgba(250, 247, 242, .7); padding-block: clamp(4rem, 7vw, 6rem) 2rem; font-size: .92rem; }
.rj-footer a { text-decoration: none; }
.rj-footer a:hover { color: var(--c-ivory); }
.rj-footer .rj-logo { color: var(--c-ivory); }
.rj-footer .rj-logo__loc { color: var(--c-gold-soft); }
.rj-footer__grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; padding-bottom: 3rem; border-bottom: 1px solid var(--c-line-dark); }
.rj-footer__brand p { max-width: 22rem; margin-top: 1.25rem; }
.rj-footer h2 { font-family: var(--f-sans); font-size: .72rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--c-gold-soft); margin-bottom: 1.1rem; }
.rj-footer li + li { margin-top: .1rem; }
.rj-footer li a, .rj-footer address a { display: inline-block; padding-block: .6rem; margin-block: -.45rem; }
.rj-footer address { font-style: normal; line-height: 1.8; }
.rj-social { display: flex; gap: .6rem; margin-top: 1.5rem; }
.rj-social a { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--c-line-dark); }
.rj-social svg { width: 16px; height: 16px; }
.rj-social span { display: inline-grid; place-items: center; width: 40px; height: 40px; border: 1px dashed var(--c-line-dark); opacity: .6; }
.rj-footer__bottom { display: flex; flex-direction: column; gap: .75rem; justify-content: space-between; padding-top: 1.75rem; font-size: .8rem; }
.rj-footer__bottom ul { display: flex; gap: 1.5rem; }
.rj-footer__bottom li + li { margin-top: 0; }
@media (min-width: 768px) {
  .rj-footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1.2fr; }
  .rj-footer__bottom { flex-direction: row; }
}

/* ---------- 21. MOTION (subtle; fails open) ---------- */
/* Page heroes animate with CSS only, so first-screen content never waits for JavaScript. */
@keyframes rj-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.rj-hero__content > *, .rj-phero__content > *, .rj-intro .rj-container > *,
.rj-pagehead .rj-container > *, .rj-article-head .rj-container > * { animation: rj-rise .8s var(--ease) both; }
:is(.rj-hero__content, .rj-phero__content, .rj-intro .rj-container, .rj-pagehead .rj-container, .rj-article-head .rj-container) > :nth-child(2) { animation-delay: .06s; }
:is(.rj-hero__content, .rj-phero__content, .rj-intro .rj-container, .rj-pagehead .rj-container, .rj-article-head .rj-container) > :nth-child(3) { animation-delay: .12s; }
:is(.rj-hero__content, .rj-phero__content, .rj-intro .rj-container, .rj-pagehead .rj-container, .rj-article-head .rj-container) > :nth-child(4) { animation-delay: .18s; }
:is(.rj-hero__content, .rj-phero__content, .rj-intro .rj-container, .rj-pagehead .rj-container, .rj-article-head .rj-container) > :nth-child(n+5) { animation-delay: .24s; }
.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity 1s var(--ease), transform 1s var(--ease); }
.js .reveal.is-in { opacity: 1; transform: none; }
.js .reveal-img img { transform: scale(1.06); transition: transform 1.6s var(--ease); }
.js .reveal-img.is-in img { transform: scale(1); }
.reveal[data-delay="1"] { transition-delay: .12s; }
.reveal[data-delay="2"] { transition-delay: .24s; }
.reveal[data-delay="3"] { transition-delay: .36s; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .reveal, .js .reveal-img img { opacity: 1; transform: none; transition: none; }
  .rj-hero__content > *, .rj-phero__content > *, .rj-intro .rj-container > *,
  .rj-pagehead .rj-container > *, .rj-article-head .rj-container > * { animation: none; }
  .rj-media img { transition: none; }
}

/* ---------- 22. SMALL-SCREEN REFINEMENTS ---------- */
@media (max-width: 639px) {
  .rj-btns .rj-btn { flex: 1 1 100%; }
  .rj-bridal__cats a { font-size: 1.12rem; gap: .5rem; }
  .rj-stat__label { font-size: .64rem; letter-spacing: .1em; }
}

/* =========================================================================
   INNER PAGES: Collections / category template
   (WooCommerce later: category hero + subcategory grid = Product Category archive)
   ========================================================================= */

/* ---------- 23. BREADCRUMB ---------- */
.rj-breadcrumb { font-size: .75rem; letter-spacing: .08em; color: var(--c-muted); }
.rj-breadcrumb ol { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; padding: 0; list-style: none; }
.rj-breadcrumb li + li::before { content: "/"; margin-right: .4rem; color: var(--c-beige); }
.rj-breadcrumb a { text-decoration: none; }
.rj-breadcrumb a:hover { color: var(--c-charcoal); text-decoration: underline; text-underline-offset: 3px; }
.rj-breadcrumb [aria-current] { color: var(--c-charcoal); }

/* ---------- 24. PAGE HERO (category) ---------- */
.rj-phero { padding: 0; background: var(--c-ivory); }
.rj-phero__grid { display: flex; flex-direction: column; }
.rj-phero__media { order: -1; aspect-ratio: 4 / 3.2; max-height: 46svh; width: 100%; }
.rj-phero__content { padding: 1.75rem var(--gutter) 3.5rem; display: flex; flex-direction: column; gap: 1.2rem; }
.rj-phero h1 { font-size: clamp(2.5rem, 5vw, 4.4rem); line-height: 1.04; }
.rj-phero .rj-lead { max-width: 34rem; }
.rj-phero__facts { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; padding-top: 1.25rem; margin-top: .5rem; border-top: 1px solid var(--c-line); font-size: .82rem; color: var(--c-muted); }
.rj-phero__facts li { display: flex; align-items: center; gap: .5rem; }
.rj-phero__facts svg { width: 16px; height: 16px; color: var(--c-gold); }
@media (min-width: 1024px) {
  .rj-phero__grid { flex-direction: row; min-height: min(78svh, 760px); }
  .rj-phero__content { flex: 0 0 50%; justify-content: center; padding: 3.5rem 4vw 4rem max(var(--gutter), calc((100vw - var(--container)) / 2)); }
  .rj-phero__media { order: 0; flex: 1; aspect-ratio: auto; max-height: none; }
}

/* Centered page intro (All Collections) */
.rj-intro { text-align: center; padding-block: clamp(3rem, 7vw, 6rem) clamp(2.5rem, 5vw, 4rem); }
.rj-intro .rj-container { display: flex; flex-direction: column; align-items: center; gap: 1.25rem; }
.rj-intro h1 { font-size: clamp(2.8rem, 6vw, 5rem); }
.rj-intro .rj-lead { margin-inline: auto; }
.rj-intro .rj-breadcrumb ol { justify-content: center; }

/* ---------- 25. GRIDS ---------- */
.rj-grid-3 { display: grid; grid-template-columns: 1fr; gap: 2.75rem 1.5rem; }
.rj-grid-3:has(> .rj-sub) { grid-template-columns: repeat(2, 1fr); gap: 2rem 1rem; }
@media (max-width: 639px) {
  .rj-sub h3 { font-size: 1.2rem; }
  .rj-sub__row { flex-direction: column; gap: .2rem; }
  .rj-sub p { font-size: .85rem; line-height: 1.5; }
}
@media (min-width: 640px) { .rj-grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .rj-grid-3 { grid-template-columns: repeat(3, 1fr); gap: 3.5rem 2rem; } }

/* Subcategory tile (= WooCommerce subcategory) */
.rj-sub { display: flex; flex-direction: column; gap: .9rem; text-decoration: none; color: inherit; }
.rj-sub:hover .rj-media img { transform: scale(1.04); }
.rj-sub__row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; border-bottom: 1px solid var(--c-line); padding-bottom: .75rem; }
.rj-sub h3 { font-size: clamp(1.45rem, 2vw, 1.75rem); }
.rj-sub__go { font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-gold); white-space: nowrap; transition: transform .35s var(--ease); }
.rj-sub:hover .rj-sub__go { transform: translateX(4px); }
.rj-sub p { margin: 0; color: var(--c-muted); font-size: .95rem; }

/* ---------- 26. IN-STORE NOTICE (no online inventory yet) ---------- */
.rj-instore { border: 1px solid var(--c-beige); background: var(--c-white); padding: clamp(1.75rem, 4vw, 3rem); display: flex; flex-direction: column; gap: 1.5rem; }
.rj-instore h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); }
.rj-instore p { margin: 0; max-width: 40rem; }
.rj-instore .rj-btns { margin-top: 0; }
@media (min-width: 1024px) {
  .rj-instore { flex-direction: row; align-items: center; justify-content: space-between; gap: 3rem; }
  .rj-instore > div:first-child { display: grid; gap: .75rem; }
  .rj-instore .rj-btns { flex-wrap: nowrap; flex: none; }
}

/* ---------- 27. TABLE (gold purity) ---------- */
.rj-table { width: 100%; border-collapse: collapse; font-size: .95rem; margin-block: .5rem 1rem; }
.rj-table caption { text-align: left; font-size: .8rem; color: var(--c-muted); caption-side: bottom; padding-top: .9rem; }
.rj-table th, .rj-table td { text-align: left; padding: 1rem .75rem 1rem 0; border-bottom: 1px solid var(--c-beige); vertical-align: top; }
.rj-table thead th { font-size: .7rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); border-bottom-color: var(--c-charcoal); }
.rj-table tbody th { font-family: var(--f-serif); font-size: 1.35rem; font-weight: 500; color: var(--c-charcoal); white-space: nowrap; }
.rj-table tr.is-hl th, .rj-table tr.is-hl td { background: rgba(194, 162, 107, .14); }
.rj-table tr.is-hl th { padding-left: .75rem; }
.rj-table td:nth-child(2) { white-space: nowrap; color: var(--c-charcoal); font-weight: 500; }

/* ---------- 28. GUIDE LIST (piece by piece) ---------- */
.rj-guide { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--c-line); }
.rj-guide__item { display: grid; grid-template-columns: 3rem 1fr; gap: .35rem 1rem; padding: 1.5rem 0; border-bottom: 1px solid var(--c-line); }
.rj-guide__num { font-family: var(--f-serif); font-size: 1.15rem; color: var(--c-gold); grid-row: span 2; }
.rj-guide__item h3 { font-size: 1.45rem; }
.rj-guide__item p { margin: 0; color: var(--c-ink); font-size: .95rem; }
.rj-section--dark .rj-guide, .rj-section--dark .rj-guide__item { border-color: var(--c-line-dark); }
.rj-section--dark .rj-guide__item p { color: rgba(250, 247, 242, .78); }
.rj-section--dark .rj-guide__num { color: var(--c-gold-soft); }
@media (min-width: 768px) { .rj-guide { grid-template-columns: 1fr 1fr; column-gap: 3rem; } }

/* ---------- 29. STEPS (consultation) ---------- */
.rj-steps { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.rj-step { background: var(--c-ivory); padding: 2rem; display: flex; flex-direction: column; gap: .75rem; border-top: 2px solid var(--c-gold-soft); }
.rj-step__num { font-family: var(--f-serif); font-size: 2.6rem; line-height: 1; color: var(--c-gold); }
.rj-step h3 { font-size: 1.5rem; }
.rj-step p { margin: 0; color: var(--c-ink); font-size: .95rem; }
@media (min-width: 900px) { .rj-steps { grid-template-columns: repeat(3, 1fr); } }

/* ---------- 30. COLLECTION ROWS (All Collections page) ---------- */
.rj-crow + .rj-crow { margin-top: clamp(4rem, 9vw, 8rem); }
.rj-crow__media .rj-media { aspect-ratio: 4 / 5; }
.rj-crow__num { font-family: var(--f-serif); font-size: 1rem; color: var(--c-gold); letter-spacing: .1em; }
.rj-crow h2 { font-size: clamp(2.2rem, 4vw, 3.4rem); }
.rj-crow__links { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; padding-block: 1rem; border-block: 1px solid var(--c-line); margin-block: .5rem; }
.rj-crow__links a { font-size: .9rem; text-decoration: none; color: var(--c-ink); padding-block: .25rem; }
.rj-crow__links a:hover { color: var(--c-gold); }
@media (min-width: 1024px) {
  .rj-crow__media { flex: 0 0 48% !important; }
  .rj-crow--flip { flex-direction: row-reverse; }
}

/* ---------- 31. PRODUCT CARD (ready for WooCommerce; unused until real inventory) ---------- */
.rj-product { display: flex; flex-direction: column; gap: .6rem; }
.rj-product__name { font-family: var(--f-serif); font-size: 1.35rem; color: var(--c-charcoal); text-decoration: none; }
.rj-product__meta { font-size: .78rem; letter-spacing: .08em; color: var(--c-muted); text-transform: uppercase; }
.rj-product__price { font-weight: 500; color: var(--c-charcoal); }

/* ---------- 32. CARD WITH TEXT ONLY (occasions without photos) ---------- */
.rj-note { background: var(--c-white); border: 1px solid var(--c-line); padding: 2rem; display: flex; flex-direction: column; gap: .75rem; }
.rj-note h3 { font-size: 1.5rem; }
.rj-note p { margin: 0; color: var(--c-ink); font-size: .95rem; }
.rj-note svg { width: 28px; height: 28px; color: var(--c-gold); }

/* =========================================================================
   CONTACT PAGES: Book a Consultation / Visit Us
   ========================================================================= */

/* ---------- 33. COMPACT PAGE HEADER ---------- */
.rj-pagehead { padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(2rem, 4vw, 3rem); border-bottom: 1px solid var(--c-line); }
.rj-pagehead .rj-container { display: flex; flex-direction: column; gap: 1.1rem; }
.rj-pagehead h1 { font-size: clamp(2.6rem, 5.5vw, 4.6rem); line-height: 1.04; max-width: 16ch; }
.rj-pagehead .rj-lead { max-width: 40rem; }

/* ---------- 34. BOOKING LAYOUT (form + supporting info) ---------- */
.rj-booking { display: flex; flex-direction: column; gap: clamp(2.5rem, 5vw, 4rem); }
.rj-booking__aside { display: flex; flex-direction: column; gap: 2rem; }
.rj-booking__form .rj-form { border: 1px solid var(--c-line); background: var(--c-white); }
.rj-form__hint { font-size: .78rem; color: var(--c-muted); margin: 0; }
.rj-field .rj-optional { font-weight: 400; letter-spacing: .04em; text-transform: none; color: var(--c-muted); }
@media (min-width: 1024px) {
  .rj-booking { flex-direction: row; align-items: flex-start; }
  .rj-booking__form { flex: 0 0 54%; order: 2; position: sticky; top: calc(var(--header-h) + 1.5rem); }
  .rj-booking__aside { flex: 1; order: 1; padding-right: 2vw; }
}

/* Contact list (aside + visit page) */
.rj-contact { display: grid; gap: 1.1rem; padding: 1.75rem; background: var(--c-cream); }
.rj-contact h2 { font-size: 1.6rem; }

/* Consultation types */
.rj-types { display: grid; grid-template-columns: 1fr; gap: 1px; background: var(--c-line); border: 1px solid var(--c-line); }
.rj-type { background: var(--c-ivory); padding: 1.5rem 1.5rem 1.6rem; display: grid; grid-template-columns: 30px 1fr; gap: .25rem 1rem; }
.rj-type svg { width: 26px; height: 26px; color: var(--c-gold); grid-row: span 2; margin-top: .15rem; }
.rj-type h3 { font-size: 1.35rem; }
.rj-type p { margin: 0; font-size: .92rem; color: var(--c-muted); }
@media (min-width: 640px) { .rj-types { grid-template-columns: 1fr 1fr; } }

/* ---------- 35. MAP ---------- */
.rj-map { position: relative; aspect-ratio: 4 / 3; background: var(--c-champagne); border: 1px solid var(--c-line); overflow: hidden; }
.rj-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.35) sepia(.12); }
@media (min-width: 1024px) { .rj-map { aspect-ratio: auto; min-height: 520px; height: 100%; } }

/* ---------- 36. LOCATIONS ---------- */
.rj-locs { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.rj-loc { border: 1px solid var(--c-line); background: var(--c-white); padding: clamp(1.75rem, 3vw, 2.5rem); display: flex; flex-direction: column; gap: 1rem; }
.rj-loc--current { border-color: var(--c-gold-soft); box-shadow: inset 0 3px 0 var(--c-gold-soft); }
.rj-loc__tag { align-self: flex-start; font-size: .68rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-gold); }
.rj-loc h3 { font-size: 1.75rem; }
.rj-loc address { font-style: normal; line-height: 1.75; }
.rj-loc .rj-btns { margin-top: auto; padding-top: .5rem; }
@media (min-width: 768px) { .rj-locs { grid-template-columns: 1fr 1fr; } }

/* Nearby communities */
.rj-areas { display: flex; flex-wrap: wrap; gap: .5rem; }
.rj-areas li { border: 1px solid var(--c-line); padding: .45rem .9rem; font-size: .85rem; color: var(--c-ink); background: var(--c-ivory); }
@media (min-width: 1024px) { .rj-booking__aside .rj-types { grid-template-columns: 1fr; } }

/* =========================================================================
   OUR STORY + JOURNAL
   ========================================================================= */

/* ---------- 37. STORY CHAPTERS ---------- */
.rj-chapter__num { font-family: var(--f-serif); font-style: italic; font-size: 1.15rem; color: var(--c-gold); }
.rj-chapter + .rj-chapter { margin-top: clamp(4rem, 9vw, 8rem); }
.rj-chapter .rj-media { aspect-ratio: 4 / 5; }
@media (min-width: 1024px) {
  .rj-chapter__media { flex: 0 0 44% !important; }
  .rj-chapter--flip { flex-direction: row-reverse; }
  .rj-chapter .rj-col--text { padding-inline: 2vw; }
}

/* Pull quote (family voice) */
.rj-pullquote { max-width: 52rem; margin-inline: auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 1.5rem; }
.rj-pullquote blockquote { margin: 0; font-family: var(--f-serif); font-size: clamp(1.7rem, 3.4vw, 2.7rem); line-height: 1.3; color: var(--c-ivory); font-weight: 400; font-style: italic; }
.rj-pullquote figcaption { font-size: .75rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--c-gold-soft); }

/* Placeholder photo slot (no stock substitute for real family photos) */
.rj-photo-slot { aspect-ratio: 4 / 5; border: 1px dashed var(--c-gold); background: repeating-linear-gradient(135deg, var(--c-cream) 0 14px, var(--c-champagne) 14px 15px); display: grid; place-items: center; text-align: center; padding: 2rem; color: var(--c-muted); font-size: .9rem; }
.rj-photo-slot strong { display: block; font-family: var(--f-serif); font-weight: 500; font-size: 1.4rem; color: var(--c-charcoal); margin-bottom: .35rem; }

/* Values grid */
.rj-grid-4 { display: grid; grid-template-columns: 1fr; gap: 0; border-top: 1px solid var(--c-line); }
.rj-grid-4 .rj-why { border-bottom: 1px solid var(--c-line); }
@media (min-width: 640px) { .rj-grid-4 { grid-template-columns: 1fr 1fr; column-gap: 2.5rem; } }
@media (min-width: 1100px) {
  .rj-grid-4 { grid-template-columns: repeat(4, 1fr); column-gap: 0; border-bottom: 1px solid var(--c-line); }
  .rj-grid-4 .rj-why { padding: 2.5rem 1.75rem 2.75rem; border-bottom: 0; }
  .rj-grid-4 .rj-why + .rj-why { border-left: 1px solid var(--c-line); }
  .rj-grid-4 .rj-why:first-child { padding-left: 0; }
}

/* ---------- 38. JOURNAL INDEX ---------- */
.rj-feature { display: flex; flex-direction: column; gap: 1.5rem; text-decoration: none; color: inherit; }
.rj-feature:hover .rj-media img { transform: scale(1.03); }
.rj-feature .rj-media { aspect-ratio: 3 / 2; }
.rj-feature h2 { font-size: clamp(2rem, 3.6vw, 3rem); }
.rj-feature p { margin: 0; }
@media (min-width: 1024px) {
  .rj-feature { flex-direction: row; align-items: center; gap: 4rem; }
  .rj-feature .rj-media { flex: 0 0 56%; }
  .rj-feature > div { display: flex; flex-direction: column; gap: 1.1rem; }
}
.rj-upcoming { display: grid; grid-template-columns: 1fr; border-top: 1px solid var(--c-line); }
.rj-upcoming li { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 1.1rem 0; border-bottom: 1px solid var(--c-line); font-family: var(--f-serif); font-size: 1.3rem; color: var(--c-charcoal); }
.rj-upcoming li span { font-family: var(--f-sans); font-size: .68rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); white-space: nowrap; }
@media (min-width: 768px) { .rj-upcoming { grid-template-columns: 1fr 1fr; column-gap: 3rem; } }

/* ---------- 39. ARTICLE ---------- */
.rj-article-head { padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(2rem, 4vw, 3rem); }
.rj-article-head .rj-container { max-width: calc(52rem + var(--gutter) * 2); display: flex; flex-direction: column; gap: 1.1rem; }
.rj-article-head h1 { font-size: clamp(2.4rem, 5vw, 4.1rem); line-height: 1.06; }
.rj-article-meta { display: flex; flex-wrap: wrap; gap: .4rem 1.25rem; font-size: .8rem; color: var(--c-muted); padding-top: 1rem; border-top: 1px solid var(--c-line); }
.rj-article-hero { max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.rj-article-hero .rj-media { aspect-ratio: 16 / 9; }
.rj-article-hero figcaption { font-size: .78rem; color: var(--c-muted); margin-top: .6rem; }

.rj-prose { max-width: calc(44rem + var(--gutter) * 2); margin-inline: auto; padding: clamp(2.5rem, 6vw, 4.5rem) var(--gutter) clamp(3rem, 7vw, 5rem); font-size: 1.06rem; line-height: 1.8; }
.rj-prose > * + * { margin-top: 1.25em; }
.rj-prose p { margin-bottom: 0; }
.rj-prose h2 { font-size: clamp(1.85rem, 3vw, 2.4rem); margin-top: 2.2em; scroll-margin-top: calc(var(--header-h) + 1rem); }
.rj-prose h3 { font-size: 1.5rem; margin-top: 1.8em; }
.rj-prose ul, .rj-prose ol { padding-left: 1.25rem; }
.rj-prose ul { list-style: none; padding-left: 0; }
.rj-prose ul li { position: relative; padding-left: 1.5rem; }
.rj-prose ul li::before { content: ""; position: absolute; left: 0; top: .78em; width: 7px; height: 7px; background: var(--c-gold-soft); transform: rotate(45deg); }
.rj-prose ol { list-style: decimal; }
.rj-prose li + li { margin-top: .5em; }
.rj-prose a { color: var(--c-charcoal); text-decoration-color: var(--c-gold); text-underline-offset: 3px; }
.rj-prose strong { color: var(--c-charcoal); font-weight: 600; }
.rj-prose figure { margin-block: 2.25em; }
.rj-prose figure .rj-media { aspect-ratio: 3 / 2; }
.rj-prose figcaption { font-size: .8rem; color: var(--c-muted); margin-top: .6rem; }

/* Quick answer (summary for readers + AI search) */
.rj-answer { background: var(--c-cream); border-left: 3px solid var(--c-gold-soft); padding: 1.5rem 1.75rem; font-size: 1rem; }
.rj-answer__label { font-size: .7rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--c-gold); margin-bottom: .5rem !important; }
.rj-answer p + p { margin-top: .6em; }

/* Table of contents */
.rj-toc { border: 1px solid var(--c-line); padding: 1.25rem 1.5rem; font-size: .95rem; }
.rj-toc p { font-size: .7rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--c-muted); }
.rj-toc ol { margin: .6rem 0 0; padding-left: 1.2rem; list-style: decimal; }
.rj-toc li + li { margin-top: .3em; }
.rj-toc a { text-decoration: none; }
.rj-toc a:hover { text-decoration: underline; }

/* In-article call to action */
.rj-callout { background: var(--c-charcoal); color: rgba(250, 247, 242, .82); padding: 1.75rem 2rem; display: flex; flex-direction: column; gap: 1rem; }
.rj-callout h3 { color: var(--c-ivory); font-size: 1.6rem; margin: 0 !important; }
.rj-callout p { margin: 0; font-size: .98rem; }
.rj-prose .rj-callout a.rj-btn { color: var(--c-charcoal); text-decoration: none; align-self: flex-start; }
.rj-prose .rj-callout a.rj-btn:hover { color: var(--c-ivory); }

.rj-prose .rj-faq { margin-top: 1rem; }
.rj-prose .rj-faq__answer p { font-size: 1rem; }

/* =========================================================================
   HERO VARIANTS (comparison: /hero-a/, /hero-b/)
   ========================================================================= */

/* ---------- 40. HERO A: MAGAZINE COVER ----------
   Elementor: Container (full width, background image + gradient overlay, min-height)
     └─ Container .rj-hero-a__inner (border 1px gold @55%, column, space-between)
          ├─ Eyebrow (top)
          └─ Container (bottom): H1 · Text · Buttons · Row container of 3 links */
.rj-hero-a { position: relative; padding: 0; background: var(--c-charcoal); color: var(--c-ivory); overflow: hidden; }
.rj-hero-a__media { position: absolute; inset: 0; margin: 0; }
.rj-hero-a__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; }
.rj-hero-a__shade {
  position: absolute; inset: 0;
  background:
    linear-gradient(0deg, rgba(20, 18, 16, .86) 0%, rgba(20, 18, 16, .62) 45%, rgba(20, 18, 16, 0) 78%),
    linear-gradient(180deg, rgba(20, 18, 16, .5) 0%, rgba(20, 18, 16, 0) 20%),
    linear-gradient(90deg, rgba(20, 18, 16, .35), rgba(20, 18, 16, 0) 55%);
}
.rj-hero-a__frame { position: relative; z-index: 1; display: flex; min-height: calc(88svh - var(--header-h)); padding: .75rem; }
.rj-hero-a__inner {
  flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 1rem; /* phones: eyebrow sits just above the headline */
  border: 1px solid rgba(194, 162, 107, .55); padding: 1.5rem 1.25rem 1.25rem;
}
.rj-hero-a .rj-eyebrow { color: var(--c-gold-soft); }
.rj-hero-a__body { display: flex; flex-direction: column; gap: 1rem; }
.rj-hero-a h1 { color: var(--c-ivory); font-size: clamp(2.5rem, min(6vw, 9vh), 6.2rem); line-height: 1; letter-spacing: -.015em; }
.rj-hero-a h1 span { display: block; }
.rj-hero-a h1 em { color: #E9D6B0; }
.rj-hero-a .rj-lead { color: rgba(250, 247, 242, .88); max-width: 32rem; font-size: 1rem; }
.rj-hero-a .rj-btns { margin-top: .25rem; }
.rj-hero-a__cols { display: none; }
@media (min-width: 768px) {
  .rj-hero-a__frame { padding: 1.25rem; min-height: calc(100svh - var(--header-h) - 38px); }
  .rj-hero-a__inner { justify-content: space-between; gap: 2rem; padding: clamp(1.75rem, 3.5vw, 3rem); }
  .rj-hero-a .rj-lead { font-size: var(--t-lead); }
  .rj-hero-a__cols {
    display: flex; gap: clamp(1.5rem, 3vw, 3rem); margin-top: 1.5rem; padding-top: 1.25rem;
    border-top: 1px solid rgba(250, 247, 242, .22);
  }
  .rj-hero-a__cols a {
    display: inline-flex; align-items: center; gap: .6rem; min-height: 44px; text-decoration: none; color: var(--c-ivory);
    font-size: .75rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; opacity: .85;
    transition: opacity .3s, color .3s;
  }
  .rj-hero-a__cols a::after { content: "→"; letter-spacing: 0; transition: transform .35s var(--ease); }
  .rj-hero-a__cols a:hover { opacity: 1; color: #E9D6B0; }
  .rj-hero-a__cols a:hover::after { transform: translateX(4px); }
}
@media (min-width: 1024px) {
  .rj-hero-a__media img { object-position: 50% 30%; }
  .rj-hero-a__shade {
    background:
      linear-gradient(90deg, rgba(20, 18, 16, .78) 0%, rgba(20, 18, 16, .5) 34%, rgba(20, 18, 16, 0) 62%),
      linear-gradient(0deg, rgba(20, 18, 16, .45), rgba(20, 18, 16, 0) 40%);
  }
}

/* ---------- 41. HERO B: TRIPTYCH ----------
   Elementor: Container (column)
     ├─ Container .rj-hero-b__band (row on desktop): H1 | Text + Buttons
     └─ Container .rj-hero-b__panels (row; scroll-snap on phones via custom CSS):
          3 × Link container (background image + overlay): Eyebrow · H2 · Text link */
.rj-hero-b { padding: 0; background: var(--c-ivory); display: flex; flex-direction: column; }
.rj-hero-b__band { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding: 1.5rem var(--gutter) 2.25rem; display: flex; flex-direction: column; gap: 1rem; }
.rj-hero-b h1 { font-size: clamp(2.2rem, min(3.7vw, 6.4vh), 4rem); line-height: 1.04; }
.rj-hero-b h1 span { display: block; }
.rj-hero-b .rj-lead { max-width: 30rem; font-size: 1rem; }
.rj-hero-b .rj-btns { margin-top: .25rem; }

.rj-hero-b__panels {
  order: -1; display: flex; gap: .5rem; height: 52svh; min-height: 320px;
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
  padding: .75rem var(--gutter) 0; scroll-padding-inline: var(--gutter);
}
.rj-hero-b__panels::-webkit-scrollbar { display: none; }
.rj-tri {
  position: relative; flex: 0 0 80%; overflow: hidden; scroll-snap-align: start;
  display: flex; align-items: flex-end; text-decoration: none; color: var(--c-ivory); background: var(--c-charcoal);
}
.rj-tri img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.rj-tri::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(20, 18, 16, .78) 0%, rgba(20, 18, 16, .2) 42%, rgba(20, 18, 16, 0) 60%); }
.rj-tri__label { position: relative; z-index: 2; display: flex; flex-direction: column; gap: .35rem; padding: 1.25rem; }
.rj-tri__num { font-size: .68rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #E9D6B0; }
.rj-tri__title { font-family: var(--f-serif); font-size: clamp(1.7rem, 2.6vw, 2.5rem); line-height: 1.05; color: var(--c-ivory); }
.rj-tri__go { font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; opacity: .85; display: inline-flex; gap: .5rem; }
.rj-tri__go::after { content: "→"; letter-spacing: 0; transition: transform .35s var(--ease); }
.rj-tri:hover img { transform: scale(1.04); }
.rj-tri:hover .rj-tri__go::after { transform: translateX(4px); }
.rj-tri:focus-visible { outline-offset: -4px; }

@media (min-width: 1024px) {
  .rj-hero-b { min-height: calc(100svh - var(--header-h) - 38px); }
  .rj-hero-b__band { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 3rem; padding-block: 1.75rem 1.75rem; }
  .rj-hero-b__band > div:last-child { flex: 0 0 auto; width: min(27rem, 40%); display: flex; flex-direction: column; gap: .9rem; padding-bottom: .35rem; }
  .rj-hero-b__band .rj-btns { flex-wrap: nowrap; }
  .rj-hero-b__band .rj-btn { padding-inline: 1.4rem; }
  /* panels fill whatever height is left under the band, so their labels stay above the fold */
  .rj-hero-b__panels {
    order: 0; overflow: visible; scroll-snap-type: none; gap: 6px; padding: 0;
    flex: 1 1 auto; height: auto; min-height: 340px; max-height: 760px;
  }
  .rj-tri { flex: 1 1 0; transition: flex-grow .8s var(--ease); }
  .rj-tri:hover, .rj-tri:focus-visible { flex-grow: 1.45; }
  .rj-tri__label { padding: clamp(1.5rem, 2.5vw, 2.5rem); }
}
@media (prefers-reduced-motion: reduce) { .rj-tri, .rj-tri img { transition: none; } }

/* ---------- 42. HERO PREVIEW SWITCHER (preview builds only) ---------- */
.rj-lab {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(60px + 12px); z-index: 150;
  display: flex; align-items: center; gap: .25rem; padding: .3rem; background: rgba(28, 26, 23, .92);
  border: 1px solid rgba(194, 162, 107, .45); box-shadow: 0 8px 30px rgba(0, 0, 0, .25);
  font: 600 .68rem/1 var(--f-sans); letter-spacing: .1em; text-transform: uppercase; white-space: nowrap;
}
.rj-lab span { color: var(--c-gold-soft); padding: 0 .6rem 0 .5rem; }
.rj-lab a { color: rgba(250, 247, 242, .8); text-decoration: none; padding: .7rem .75rem; min-height: 36px; display: inline-flex; align-items: center; }
.rj-lab a:hover { color: var(--c-ivory); }
.rj-lab a[aria-current="page"] { background: var(--c-ivory); color: var(--c-charcoal); }
@media (min-width: 768px) { .rj-lab { bottom: 1.25rem; left: auto; right: 1.25rem; transform: none; } }
@media (max-width: 520px) { .rj-lab span { display: none; } .rj-lab { max-width: calc(100vw - 16px); overflow-x: auto; scrollbar-width: none; } .rj-lab a { padding-inline: .5rem; letter-spacing: .04em; } }

/* ---------- 43. HERO C: TEXT FIRST + PANORAMA ----------
   Elementor: Container (column, centered)
     ├─ Container (boxed, centered text): Eyebrow · Ornament · H1 · Text · Buttons
     └─ Container (full width, small side gutter): Image (cover, 21:9 desktop / 4:3 phones) + caption row */
.rj-hero-c { padding: 0; background: var(--c-ivory); }
.rj-hero-c__text {
  max-width: calc(58rem + var(--gutter) * 2); margin-inline: auto; padding: 2.25rem var(--gutter) 2rem;
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1rem;
}
.rj-hero-c h1 { font-size: clamp(2.3rem, min(4.4vw, 6.6vh), 4.6rem); line-height: 1.04; }
.rj-hero-c h1 span { display: block; }
.rj-hero-c .rj-lead { max-width: 34rem; margin-inline: auto; }
.rj-hero-c .rj-eyebrow span { display: block; }
@media (min-width: 768px) { .rj-hero-c .rj-eyebrow span { display: inline; } .rj-hero-c .rj-eyebrow .rj-eyebrow__loc::before { content: " · "; } }
.rj-hero-c .rj-btns { justify-content: center; margin-top: .4rem; }
.rj-hero-c__strip { padding-inline: .75rem; }
.rj-hero-c__strip .rj-media { aspect-ratio: 4 / 3; }
.rj-hero-c__strip .rj-media img { object-position: 50% 62%; }
.rj-hero-c__caption {
  display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  padding: .9rem calc(var(--gutter) - .75rem) 0; font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted);
}
.rj-hero-c__caption a { color: var(--c-charcoal); text-decoration: none; }
.rj-hero-c__caption a:hover { color: var(--c-gold); }
.rj-hero-c__caption nav { display: flex; gap: 1.5rem; flex-wrap: wrap; }
.rj-hero-c__caption nav a { display: inline-block; padding-block: .6rem; margin-block: -.6rem; }
@media (min-width: 768px) {
  .rj-hero-c__strip { padding-inline: 1.25rem; }
  .rj-hero-c__strip .rj-media { aspect-ratio: 21 / 9; max-height: 58svh; width: 100%; }
  .rj-hero-c__caption { padding-inline: calc(var(--gutter) - 1.25rem); }
}
@media (min-width: 1024px) {
  /* text block takes its natural height; the photo strip fills the rest of the first screen */
  .rj-hero-c { display: flex; flex-direction: column; min-height: calc(100svh - var(--header-h) - 38px); }
  .rj-hero-c__text { padding-block: clamp(1.5rem, 4vh, 3.25rem) clamp(1.5rem, 3.5vh, 2.5rem); gap: .85rem; }
  .rj-hero-c__strip { flex: 1 1 0; min-height: 300px; display: flex; flex-direction: column; }
  .rj-hero-c__strip .rj-media { position: relative; flex: 1 1 0; min-height: 240px; aspect-ratio: auto; max-height: none; }
  .rj-hero-c__strip .rj-media img { position: absolute; inset: 0; } /* the image's own size must not stretch the strip */
}

/* ---------- 44. HERO D: HERITAGE (THEN / NOW) ----------
   Elementor: Container (row on desktop: 3 columns)
     ├─ Container "Then": Image (archival, sepia via CSS class) + caption
     ├─ Container (center, column): Eyebrow · H1 · Text · Buttons
     └─ Container "Now": Image + caption
   Phones: the two photos side by side first, then the text. */
.rj-hero-d { padding: 0; background: var(--c-ivory); }
.rj-hero-d__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: .75rem 1rem;
  max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding: 1.25rem var(--gutter) 3rem;
}
.rj-hero-d__photo { display: flex; flex-direction: column; gap: .6rem; margin: 0; }
.rj-hero-d__photo .rj-media { aspect-ratio: 3 / 4; }
.rj-hero-d__photo--then .rj-media { background: #d9cdb8; }
.rj-hero-d__photo--then img { filter: grayscale(1) sepia(.45) contrast(.92) brightness(1.04); }
.rj-hero-d__photo figcaption { display: flex; justify-content: space-between; gap: .5rem; font-size: .68rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--c-muted); }
.rj-hero-d__photo figcaption b { color: var(--c-gold); font-weight: 600; }
.rj-hero-d__text { grid-column: 1 / -1; order: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 1rem; padding-top: 1rem; }
.rj-hero-d__since { display: flex; align-items: center; gap: .9rem; font-family: var(--f-serif); font-style: italic; font-size: 1.15rem; color: var(--c-gold); }
.rj-hero-d__since::before, .rj-hero-d__since::after { content: ""; width: 2.5rem; height: 1px; background: var(--c-gold-soft); }
.rj-hero-d h1 { font-size: clamp(2.3rem, min(3.9vw, 6.6vh), 4.2rem); line-height: 1.05; max-width: 17ch; }
.rj-hero-d .rj-lead { max-width: 30rem; }
.rj-hero-d .rj-btns { justify-content: center; }
@media (max-width: 1023px) {
  .rj-hero-d__photo .rj-media { aspect-ratio: 1 / 1; }
  .rj-hero-d__text { gap: .75rem; padding-top: .5rem; }
  .rj-hero-d .rj-lead { font-size: 1rem; line-height: 1.6; }
}
.rj-hero-d__ph { font-size: .62rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-gold); border: 1px dashed var(--c-gold); padding: .3rem .5rem; align-self: flex-start; }

@media (min-width: 1024px) {
  .rj-hero-d__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1fr); align-items: center; gap: 0 clamp(1.75rem, 3vw, 3.25rem);
    min-height: calc(100svh - var(--header-h) - 38px); padding-block: clamp(1.5rem, 4vh, 3rem);
  }
  .rj-hero-d__text { grid-column: auto; grid-row: 1; order: 0; padding-top: 0; }
  .rj-hero-d__photo--then { grid-column: 1; grid-row: 1; align-self: start; }
  .rj-hero-d__text { grid-column: 2; }
  .rj-hero-d__photo--now { grid-column: 3; grid-row: 1; align-self: end; }
  .rj-hero-d__photo .rj-media { aspect-ratio: 3 / 4; max-height: 64svh; }
  .rj-hero-d .rj-btns { flex-wrap: nowrap; }
  .rj-hero-d .rj-btn { padding-inline: 1.4rem; }
  .rj-hero-d__text { gap: .85rem; }
}

/* ---------- 45. HERO E: SLOW-MOTION VIDEO ----------
   Elementor: Container (full width; Background type: Video — or HTML widget with this markup)
     ├─ Background video + poster image + gradient overlay
     ├─ Container (bottom-left): Eyebrow · H1 · Text · Buttons
     └─ Pause/play button (bottom-right) — required for looping motion (WCAG 2.2.2)
   The still poster always renders first; the video only loads on capable connections and
   never for people who prefer reduced motion. */
.rj-hero-e { position: relative; padding: 0; overflow: hidden; background: #0f0d0b; color: var(--c-ivory); }
.rj-hero-e__media { position: absolute; inset: 0; margin: 0; }
.rj-hero-e__media img, .rj-hero-e__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rj-hero-e__media video { opacity: 0; transition: opacity 1.2s var(--ease); }
.rj-hero-e.is-playing .rj-hero-e__media video { opacity: 1; }
.rj-hero-e__shade {
  position: absolute; inset: 0;
  background:
    linear-gradient(0deg, rgba(15, 13, 11, .92) 0%, rgba(15, 13, 11, .72) 48%, rgba(15, 13, 11, .15) 85%),
    linear-gradient(180deg, rgba(15, 13, 11, .45) 0%, rgba(15, 13, 11, 0) 22%);
}
.rj-hero-e__inner {
  position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 1rem;
  min-height: calc(86svh - var(--header-h));
  max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding: 2rem var(--gutter) 2.5rem;
}
.rj-hero-e .rj-eyebrow { color: var(--c-ivory); text-shadow: 0 1px 12px rgba(15, 13, 11, .6); } /* gold-on-gold is unreadable over the footage */
@media (min-width: 768px) { .rj-hero-e .rj-eyebrow { color: var(--c-gold-soft); text-shadow: none; } }
.rj-hero-e h1 { color: var(--c-ivory); font-size: clamp(2.4rem, min(5.6vw, 8.4vh), 5.8rem); line-height: 1.02; }
.rj-hero-e h1 span { display: block; }
.rj-hero-e h1 em { color: #E9D6B0; }
.rj-hero-e .rj-lead { color: rgba(250, 247, 242, .88); max-width: 32rem; font-size: 1rem; }
.rj-hero-e__toggle {
  position: absolute; z-index: 2; right: var(--gutter); top: 1rem; width: 44px; height: 44px; /* phones: top-right, clear of the buttons */
  display: inline-grid; place-items: center; border: 1px solid rgba(250, 247, 242, .45); border-radius: 50%;
  background: rgba(15, 13, 11, .35); color: var(--c-ivory); cursor: pointer;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.rj-hero-e__toggle[hidden] { display: none; }
.rj-hero-e__toggle svg { width: 14px; height: 14px; }
.rj-hero-e__toggle:hover { border-color: var(--c-ivory); }
@media (min-width: 768px) {
  .rj-hero-e__inner { min-height: calc(100svh - var(--header-h) - 38px); padding-block: 3rem clamp(2.5rem, 7vh, 4.5rem); }
  .rj-hero-e .rj-lead { font-size: var(--t-lead); }
  .rj-hero-e__shade {
    background:
      linear-gradient(90deg, rgba(15, 13, 11, .82) 0%, rgba(15, 13, 11, .45) 40%, rgba(15, 13, 11, 0) 70%),
      linear-gradient(0deg, rgba(15, 13, 11, .55) 0%, rgba(15, 13, 11, 0) 45%);
  }
  .rj-hero-e__toggle { top: auto; bottom: 2rem; }
}
@media (prefers-reduced-motion: reduce) { .rj-hero-e__media video { display: none; } }

/* =========================================================================
   SHOP (WooCommerce shop / product archive template)
   WooCommerce later: toolbar = category filter + result count; grid = products loop;
   card = content-product.php (image, badge, title, meta, price, button).
   ========================================================================= */

/* ---------- 46. SHOP TOOLBAR ---------- */
.rj-shop-bar {
  position: sticky; top: var(--header-h); z-index: 20; background: rgba(250, 247, 242, .96);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-bottom: 1px solid var(--c-line);
}
.rj-shop-bar .rj-container { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 64px; }
.rj-chips { display: flex; gap: .5rem; overflow-x: auto; scrollbar-width: none; padding-block: .75rem; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
.rj-chips::-webkit-scrollbar { display: none; }
.rj-chip {
  flex: none; display: inline-flex; align-items: center; min-height: 40px; padding: .5rem 1rem; cursor: pointer;
  border: 1px solid var(--c-line); background: transparent; color: var(--c-ink);
  font: 500 .78rem/1 var(--f-sans); letter-spacing: .08em; text-transform: uppercase; transition: background-color .25s, color .25s, border-color .25s;
}
.rj-chip:hover { border-color: var(--c-charcoal); }
.rj-chip[aria-pressed="true"] { background: var(--c-charcoal); border-color: var(--c-charcoal); color: var(--c-ivory); }
.rj-shop-count { flex: none; font-size: .78rem; color: var(--c-muted); white-space: nowrap; display: none; }
@media (min-width: 768px) { .rj-shop-count { display: block; } .rj-chips { margin-inline: 0; padding-inline: 0; } }


/* ---------- 47. PRODUCT GRID + CARD ---------- */
.rj-grid-products { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2.25rem 1rem; }
@media (min-width: 768px) { .rj-grid-products { grid-template-columns: repeat(3, 1fr); gap: 3rem 1.5rem; } }
@media (min-width: 1200px) { .rj-grid-products { grid-template-columns: repeat(4, 1fr); } }
.rj-product { display: flex; flex-direction: column; gap: .55rem; }
.rj-product[hidden] { display: none; }
.rj-product__media { position: relative; display: block; overflow: hidden; background: var(--c-champagne); aspect-ratio: 4 / 5; }
.rj-product__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.rj-product:hover .rj-product__media img { transform: scale(1.04); }
.rj-product__badge {
  position: absolute; top: .6rem; left: .6rem; z-index: 1; padding: .3rem .55rem; background: var(--c-ivory);
  font-size: .62rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-gold);
}
.rj-product__meta { font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-gold); margin: .35rem 0 0; }
.rj-product__name { font-family: var(--f-serif); font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.2; color: var(--c-charcoal); margin: 0; font-weight: 500; }
.rj-product__price { font-size: .9rem; color: var(--c-muted); margin: 0; }
.rj-product .rj-link { align-self: flex-start; font-size: .7rem; }
.rj-product .rj-link { white-space: nowrap; }
@media (max-width: 639px) { .rj-product .rj-link { font-size: .64rem; letter-spacing: .06em; gap: .35rem; } }
.rj-shop-empty { text-align: center; color: var(--c-muted); padding: 3rem 0; }

/* ---------- 48. SHOP REVIEW FIXES ---------- */
.rj-pagehead--compact { padding-block: clamp(1.75rem, 4vw, 2.75rem) clamp(1.25rem, 3vw, 1.75rem); }
.rj-pagehead--compact .rj-container { gap: .75rem; }
.rj-pagehead--compact h1 { font-size: clamp(2.3rem, 4.4vw, 3.6rem); }

/* filter bar: pinned under the header's live height on tablet/desktop; scrolls away on phones */
.rj-shop-bar { position: static; }
@media (min-width: 768px) { .rj-shop-bar { position: sticky; top: var(--hdr, var(--header-h)); } }
@media (min-width: 1024px) { .rj-shop-bar { top: var(--hdr, var(--header-h)); } }
.rj-shop-bar .rj-container { min-height: 0; }
.rj-chip { min-height: 44px; }
@media (max-width: 767px) {
  /* soft fade at the right edge hints that the chips scroll sideways */
  .rj-chips { -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); padding-right: 2.5rem; }
}
.no-js .rj-shop-bar { display: none; } /* filters need JavaScript; without it every piece simply shows */

/* results heading: names the active collection and the count (visible on every screen size) */
.rj-shop-results { padding-top: clamp(1.5rem, 3vw, 2.25rem); }
.rj-shop-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1rem; margin-bottom: clamp(1.25rem, 2.5vw, 2rem); }
.rj-shop-heading { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.rj-shop-heading__count { font-family: var(--f-sans); font-size: .8rem; font-weight: 500; letter-spacing: .06em; color: var(--c-muted); margin-left: .5rem; white-space: nowrap; }
.rj-dev-note--sm { font-size: .62rem; padding: .3rem .6rem; }
.rj-product__badge { font-size: .68rem; }

/* shop by collection */
.rj-grid-collections--flat .rj-card:nth-child(even), .rj-grid-collections--flat > *:nth-child(even) { margin-top: 0; }
.rj-shopcoll { display: flex; flex-direction: column; gap: .9rem; }
.rj-shopcoll__links { display: flex; flex-wrap: wrap; gap: .1rem .9rem; border-top: 1px solid var(--c-line); padding-top: .6rem; }
.rj-shopcoll__links a { font-size: .85rem; color: var(--c-ink); text-decoration: none; display: inline-block; padding-block: .55rem; }
.rj-shopcoll__links a:hover { color: var(--c-gold); }
@media (max-width: 639px) { .rj-shopcoll__links a { font-size: .8rem; padding-block: .6rem; } }

/* =========================================================================
   SIGNATURE DETAILS ("do now" set): light sweep, page transitions,
   purity explainer, craft polish. All respect prefers-reduced-motion.
   ========================================================================= */

/* ---------- 49. GOLD LIGHT SWEEP ----------
   A single band of warm light passes across the text once, like light moving over metal.
   Use sparingly: the hero headline's italic phrase and ornament dividers only. */
.rj-sheen {
  --sheen-base: var(--c-charcoal);
  background: linear-gradient(100deg, var(--sheen-base) 0 42%, #E8C778 48%, #FFF1CC 50%, #E8C778 52%, var(--sheen-base) 58% 100%) 100% 0 / 260% 100% no-repeat;
  -webkit-background-clip: text; background-clip: text; color: transparent !important; /* beats section-specific em colours */
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.rj-sheen--light { --sheen-base: #E9D6B0; }
.rj-sheen.is-lit { animation: rj-sheen 2.6s cubic-bezier(.45, .05, .25, 1) .35s both; }
@keyframes rj-sheen { from { background-position: 100% 0; } to { background-position: 0 0; } }

.rj-ornament { position: relative; }
.rj-ornament::before, .rj-ornament::after {
  background: linear-gradient(90deg, currentColor 0 40%, #F3DDA2 50%, currentColor 60% 100%) 100% 0 / 300% 100% no-repeat;
}
.rj-ornament.is-lit::before, .rj-ornament.is-lit::after { animation: rj-sheen 2.2s cubic-bezier(.45, .05, .25, 1) both; }
.rj-ornament.is-lit::after { animation-delay: .25s; }
.rj-ornament svg { transition: transform 1.6s var(--ease), filter 1.6s var(--ease); }
.rj-ornament.is-lit svg { transform: rotate(45deg); filter: drop-shadow(0 0 6px rgba(232, 199, 120, .55)); }

/* ---------- 50. PAGE TRANSITIONS (cross-document View Transitions) ----------
   Supporting browsers (Chrome/Edge, Safari 18.2+) cross-fade between pages like turning a
   magazine page; the header stays put. Other browsers simply navigate as normal. */
@view-transition { navigation: auto; }
.rj-header { view-transition-name: rj-header; }
.rj-topbar { view-transition-name: rj-topbar; }
::view-transition-old(root) { animation: rj-vt-out .38s cubic-bezier(.4, 0, .2, 1) both; }
::view-transition-new(root) { animation: rj-vt-in .55s cubic-bezier(.2, .7, .2, 1) .08s both; }
@keyframes rj-vt-out { to { opacity: 0; transform: translateY(-6px); } }
@keyframes rj-vt-in { from { opacity: 0; transform: translateY(10px); } }

/* ---------- 51. 22KT PURITY EXPLAINER ---------- */
.rj-purity { border: 1px solid var(--c-beige); background: var(--c-white); padding: clamp(1.25rem, 3vw, 2rem); display: grid; gap: 1.25rem; margin-block: .5rem 1rem; }
.rj-purity__top { display: grid; grid-template-columns: auto 1fr; gap: 1.25rem; align-items: center; }
.rj-purity__swatch {
  width: clamp(84px, 12vw, 120px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, #fff8e1 0%, var(--kt-hi) 18%, var(--kt) 52%, var(--kt-lo) 100%);
  box-shadow: inset 0 -6px 14px rgba(0, 0, 0, .18), 0 8px 24px rgba(139, 107, 58, .25);
  transition: background .6s var(--ease);
}
.rj-purity__kt { font-family: var(--f-serif); font-size: clamp(2.4rem, 5vw, 3.4rem); line-height: 1; color: var(--c-charcoal); }
.rj-purity__pct { font-size: .8rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-gold); margin-top: .35rem; }
.rj-purity__note { margin: .5rem 0 0; color: var(--c-ink); font-size: .95rem; min-height: 3em; }
.rj-purity__parts { display: grid; grid-template-columns: repeat(24, 1fr); gap: 2px; }
.rj-purity__parts i { height: 10px; background: #E7E2DA; box-shadow: inset 0 0 0 1px rgba(28, 26, 23, .06); transition: background-color .5s var(--ease); } /* other metals: neutral, clearly not gold */
.rj-purity__parts i.is-gold { background: linear-gradient(180deg, var(--kt-hi), var(--kt)); }
.rj-purity__legend { display: flex; justify-content: space-between; font-size: .72rem; color: var(--c-muted); letter-spacing: .06em; }
.rj-purity input[type="range"] { width: 100%; accent-color: var(--c-gold); height: 44px; cursor: pointer; }
.rj-purity__ticks { display: flex; justify-content: space-between; margin-top: -.5rem; }
.rj-purity__ticks button {
  background: none; border: 0; cursor: pointer; font: 600 .78rem/1 var(--f-sans); letter-spacing: .08em; color: var(--c-muted);
  min-height: 44px; min-width: 44px; padding: 0 .25rem;
}
.rj-purity__ticks button[aria-pressed="true"] { color: var(--c-charcoal); }
.no-js .rj-purity { display: none; } /* the table below says the same thing without JavaScript */

/* ---------- 52. CRAFT POLISH ---------- */
body { font-kerning: normal; font-feature-settings: "kern", "liga", "calt"; }
h1, h2, h3, .rj-card__title, .rj-product__name { font-feature-settings: "kern", "liga", "dlig"; }
::selection { background: rgba(194, 162, 107, .35); color: var(--c-charcoal); }
.rj-btn:active { transform: translateY(1px); }
.rj-btn { transition: background-color .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .15s var(--ease); }

/* refined cursor over product & collection imagery (desktop pointers only) */
.rj-cursor {
  position: fixed; left: 0; top: 0; z-index: 300; pointer-events: none;
  width: 84px; height: 84px; margin: -42px 0 0 -42px; border-radius: 50%;
  display: grid; place-items: center; text-align: center;
  background: rgba(250, 247, 242, .92); color: var(--c-charcoal);
  font: 600 .62rem/1.2 var(--f-sans); letter-spacing: .16em; text-transform: uppercase;
  box-shadow: 0 6px 24px rgba(28, 26, 23, .18);
  opacity: 0; transform: translate3d(var(--x, -100px), var(--y, -100px), 0) scale(.6);
  transition: opacity .25s var(--ease), transform .25s var(--ease);
}
.rj-cursor.is-on { opacity: 1; transform: translate3d(var(--x), var(--y), 0) scale(1); }
@media (hover: hover) and (pointer: fine) { .has-rj-cursor .rj-cursor-zone { cursor: none; } }

/* 404 */
.rj-404 { min-height: calc(80svh - var(--header-h)); display: grid; place-items: center; text-align: center; padding: 4rem var(--gutter); }
.rj-404__inner { display: flex; flex-direction: column; align-items: center; gap: 1.1rem; max-width: 36rem; }
.rj-404__num { font-family: var(--f-serif); font-size: clamp(5rem, 16vw, 9rem); line-height: .9; font-style: italic; margin: 0; }

@media (prefers-reduced-motion: reduce) {
  .rj-sheen.is-lit, .rj-ornament.is-lit::before, .rj-ornament.is-lit::after { animation: none; }
  .rj-sheen { background: none; color: var(--sheen-base) !important; }
  .rj-ornament.is-lit svg { transform: none; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
  .rj-cursor { display: none; }
}

/* ---------- 53. HOMEPAGE IMAGE PRESENTATION (homepage only for now) ----------
   Unveil (heritage) · Arches (collections) · Parallax pair (22kt) · Loupe (diamonds).
   Elementor: each is an Image widget + a class and the custom CSS below. */

/* Unveil — a gold hairline draws, then the photo opens from a slit like a jewelry box lid */
.rj-unveil::after {
  content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; z-index: 2;
  background: var(--c-gold-soft); transform: scaleY(0); opacity: 0; pointer-events: none;
}
.js .rj-unveil { clip-path: inset(0 49.5% 0 49.5%); }
.js .rj-unveil.reveal-img img { transform: scale(1.18); transition: transform 2.2s var(--ease) .55s; }
.js .rj-unveil.is-in { animation: rj-unveil 1.5s cubic-bezier(.7, 0, .2, 1) .55s both; }
.js .rj-unveil.is-in img { transform: scale(1); }
.js .rj-unveil.is-in::after { animation: rj-unveil-line 1.6s var(--ease) both; }
@keyframes rj-unveil { from { clip-path: inset(0 49.5% 0 49.5%); } to { clip-path: inset(0 0 0 0); } }
@keyframes rj-unveil-line {
  0% { transform: scaleY(0); opacity: 1; } 35% { transform: scaleY(1); opacity: 1; }
  60% { transform: scaleY(1); opacity: .9; } 100% { transform: scaleY(1); opacity: 0; }
}
.js .rj-heritage__media .rj-media--inset { opacity: 0; transform: translateY(24px); transition: opacity 1s var(--ease) 1.6s, transform 1.2s var(--ease) 1.6s; }
.js .rj-heritage__media:has(.rj-unveil.is-in) .rj-media--inset { opacity: 1; transform: none; }

/* Arches — haveli-window frames; a gold hairline traces up both sides on hover (on scroll for touch) */
.rj-arch { border-radius: 999px 999px 0 0; isolation: isolate; }
.rj-arch::after {
  content: ""; position: absolute; inset: 9px; z-index: 2; pointer-events: none;
  border: 1px solid rgba(232, 199, 120, .9); border-bottom: 0; border-radius: 999px 999px 0 0;
  clip-path: inset(100% 0 0 0); transition: clip-path 1.1s var(--ease);
}
.rj-arch::before { /* soft warm glow at the crown */
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: 0;
  background: radial-gradient(60% 35% at 50% 0%, rgba(255, 236, 190, .35), transparent 70%);
  transition: opacity .9s var(--ease);
}
@media (hover: hover) {
  .rj-card:hover .rj-arch::after, .rj-card:focus-visible .rj-arch::after { clip-path: inset(0 0 0 0); }
  .rj-card:hover .rj-arch::before, .rj-card:focus-visible .rj-arch::before { opacity: 1; }
}
@media (hover: none) { .rj-card.is-in .rj-arch::after { clip-path: inset(0 0 0 0); transition-delay: .5s; } }
.no-js .rj-arch::after { clip-path: none; }
.rj-grid-collections--arches .rj-card__title { margin-top: .25rem; }

/* Parallax pair — large gold photo, overlapping detail, vertical caption; depth via --p (-1…1) */
.rj-parallax { position: relative; margin-bottom: 3.5rem; }
.rj-parallax__main { aspect-ratio: 4 / 5; }
.rj-parallax__main img { position: absolute; inset: -7% 0; height: 114%; translate: 0 calc(var(--p, 0) * 6%); }
.rj-parallax__detail {
  position: absolute; z-index: 2; width: 40%; left: -3%; bottom: -3.5rem;
  border: 8px solid var(--c-ivory); box-shadow: 0 18px 40px -18px rgba(28, 26, 23, .35);
  translate: 0 calc(var(--p, 0) * -36px);
}
.rj-parallax__caption {
  position: absolute; right: .9rem; top: 1rem; z-index: 2; margin: 0;
  writing-mode: vertical-rl; font-size: .68rem; font-weight: 600; letter-spacing: .28em; text-transform: uppercase;
  color: var(--c-ivory); text-shadow: 0 1px 8px rgba(28, 26, 23, .6);
}
@media (min-width: 1024px) {
  .rj-parallax { margin-bottom: 0; }
  .rj-parallax__detail { width: 36%; left: -11%; bottom: 8%; border-width: 10px; translate: 0 calc(var(--p, 0) * -70px); }
  .rj-parallax__caption { right: auto; left: calc(100% + 1.1rem); top: 0; color: var(--c-muted); text-shadow: none; }
}

/* Loupe — magnifier over the diamond photos (fine pointers) / tap to zoom (touch) */
.rj-loupe { cursor: zoom-in; touch-action: manipulation; }
.rj-loupe img { transition: transform .6s var(--ease); }
.rj-loupe.is-zoomed { cursor: zoom-out; }
.rj-loupe.is-zoomed img { transform: scale(2.2) !important; }
.rj-loupe__lens {
  position: absolute; z-index: 3; width: 190px; height: 190px; margin: -95px 0 0 -95px; border-radius: 50%;
  pointer-events: none; background-color: var(--c-charcoal); background-repeat: no-repeat;
  box-shadow: 0 0 0 1px rgba(232, 199, 120, .85), 0 0 0 6px rgba(28, 26, 23, .35), 0 20px 40px -10px rgba(0, 0, 0, .6);
  opacity: 0; transform: scale(.6); transition: opacity .25s, transform .35s var(--ease);
}
.rj-loupe.is-looking { cursor: none; }
.rj-loupe.is-looking .rj-loupe__lens { opacity: 1; transform: none; }
.rj-loupe__hint {
  grid-column: 1 / -1; margin: .25rem 0 0; font-size: .72rem; font-weight: 600; letter-spacing: .18em;
  text-transform: uppercase; color: rgba(250, 247, 242, .72);
}
.rj-loupe__hint::before { content: ""; display: inline-block; width: 1.6rem; height: 1px; background: var(--c-gold-soft); vertical-align: middle; margin-right: .7rem; }
.rj-loupe__hint--touch { display: none; }
@media (hover: none) { .rj-loupe__hint--fine { display: none; } .rj-loupe__hint--touch { display: inline; } }
.no-js .rj-loupe__hint { display: none; }

@media (prefers-reduced-motion: reduce) {
  .js .rj-unveil, .js .rj-unveil.is-in { clip-path: none; animation: none; }
  .js .rj-unveil::after { display: none; }
  .js .rj-heritage__media .rj-media--inset { opacity: 1; transform: none; transition: none; }
  .rj-parallax__main img, .rj-parallax__detail { translate: none; }
  .js .rj-unveil.reveal-img img { transform: none; transition: none; }
  .rj-arch::after, .rj-loupe img, .rj-loupe__lens { transition: none; }
}

/* ---------- 54. BRIDAL LOOKBOOK FILM STRIP (homepage only for now) ----------
   Default = swipeable snap row (phones, tablets, reduced motion, no JS).
   .is-pinned (JS, 1024+) = the strip pins under the header and glides sideways with page scroll. */
.rj-film { --film-pad: max(var(--gutter), calc((100vw - var(--container)) / 2)); padding-block: clamp(3.5rem, 8vw, 6rem) clamp(1rem, 3vw, 2rem); }
.rj-film__sticky { display: flex; flex-direction: column; gap: clamp(1.25rem, 2.5vw, 2rem); }
.rj-film__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem 2rem; flex-wrap: wrap; padding-inline: var(--film-pad); }
.rj-film__head .rj-eyebrow { margin-bottom: .6rem; }
.rj-film__title { font-size: clamp(2rem, 3.6vw, 3rem); }
.rj-film__ctrl { display: flex; align-items: center; gap: .5rem; }
.rj-film__count { margin: 0 .75rem 0 0; font-family: var(--f-serif); font-size: 1.15rem; color: var(--c-muted); font-variant-numeric: lining-nums tabular-nums; }
.rj-film__count span { color: var(--c-charcoal); }
.rj-film__btn {
  display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; cursor: pointer;
  background: transparent; border: 1px solid var(--c-line); color: var(--c-charcoal); border-radius: 50%;
  transition: border-color .3s, background-color .3s, opacity .3s;
}
.rj-film__btn svg { width: 14px; height: 14px; transform: rotate(90deg); }
.rj-film__btn[data-film-next] svg { transform: rotate(-90deg); }
.rj-film__btn:hover:not(:disabled) { border-color: var(--c-gold); background: rgba(194, 162, 107, .1); }
.rj-film__btn:disabled { opacity: .35; cursor: default; }
.rj-film__track {
  position: relative; display: flex; align-items: flex-start; gap: clamp(.75rem, 2vw, 1.5rem);
  list-style: none; margin: 0; padding: .5rem var(--film-pad) 1rem;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--film-pad);
  scrollbar-width: none; overscroll-behavior-x: contain;
}
.rj-film__track::-webkit-scrollbar { display: none; }
.rj-film__item { flex: 0 0 min(76vw, 360px); scroll-snap-align: start; }
@media (min-width: 640px) { .rj-film__item { flex-basis: min(40vw, 380px); } }
@media (min-width: 768px) { .rj-film__item:nth-child(even) { margin-top: 2.5rem; } }
.rj-film__frame { display: block; color: inherit; text-decoration: none; }
.rj-film__frame .rj-media { aspect-ratio: 3 / 4; }
.rj-film__frame:hover .rj-media img { transform: scale(1.04); }
.rj-film__cap { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: .75rem; padding: .9rem 0 .6rem; border-bottom: 1px solid var(--c-line); }
.rj-film__num { font-size: .72rem; font-weight: 600; letter-spacing: .14em; color: var(--c-gold); }
.rj-film__name { font-family: var(--f-serif); font-size: clamp(1.3rem, 1.8vw, 1.6rem); color: var(--c-charcoal); }
.rj-film__go { font-size: .68rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--c-muted); transition: color .3s; }
.rj-film__go::after { content: " \2192"; }
.rj-film__frame:hover .rj-film__go { color: var(--c-gold); }
.rj-film__end {
  --c-gold: #735830; aspect-ratio: 3 / 4; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 1rem;
  padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--c-champagne);
}
.rj-film__end p { margin: 0; color: var(--c-ink); }
.rj-film__end .rj-film__endtitle { font-family: var(--f-serif); font-size: clamp(1.7rem, 2.6vw, 2.3rem); line-height: 1.15; color: var(--c-charcoal); }
.rj-film__bar { margin-inline: var(--film-pad); height: 1px; background: var(--c-line); }
.rj-film__bar span { display: block; height: 100%; background: var(--c-gold); transform: scaleX(var(--film-p, 0)); transform-origin: 0 50%; }

.rj-film.is-pinned { padding: 0; }
.rj-film.is-pinned .rj-film__sticky { position: sticky; top: var(--hdr, var(--header-h)); height: calc(100svh - var(--hdr, var(--header-h))); justify-content: center; overflow: hidden; }
.rj-film.is-pinned .rj-film__track { overflow: visible; scroll-snap-type: none; transform: translate3d(var(--film-x, 0px), 0, 0); will-change: transform; padding-bottom: 2.5rem; }
.rj-film.is-pinned .rj-film__item { flex-basis: calc(min(50svh, 620px) * .75); }
.rj-film.is-pinned .rj-film__item:nth-child(even) { margin-top: 2.5rem; }
@media (prefers-reduced-motion: reduce) { .rj-film__track { scroll-behavior: auto; } .rj-film__frame .rj-media img { transition: none; } }

/* ---------- 55. JOURNAL CARD TILT (homepage only for now) ----------
   The card image leans toward the pointer and catches a soft gold glare. Fine pointers, motion allowed. */
.rj-tilt {
  transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: transform .7s var(--ease), box-shadow .7s var(--ease);
}
.rj-tilt::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .5s var(--ease);
  background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 236, 190, .38), rgba(232, 199, 120, .12) 35%, transparent 65%);
  mix-blend-mode: soft-light;
}
.rj-tilt.is-tilting { transition: transform .12s linear, box-shadow .7s var(--ease); box-shadow: 0 24px 40px -24px rgba(28, 26, 23, .45); }
.rj-tilt.is-tilting::after { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .rj-tilt { transform: none; transition: none; } .rj-tilt::after { display: none; } }

/* ---------- 56. "CONFIRM" TAGS (preview-only placeholder marker) ---------- */
/* preview-only marker for items not yet confirmed for Schaumburg (removed with the item at launch) */
.rj-ph--tag { display: inline-block; margin-left: .35rem; padding: .05rem .4rem; border: 1px dashed var(--c-gold); border-radius: 2px; font-family: var(--f-sans); font-size: .6rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--c-gold); vertical-align: middle; line-height: 1.5; }
.rj-footer .rj-ph--tag, .rj-section--dark .rj-ph--tag { color: var(--c-gold-soft); border-color: var(--c-gold-soft); }

/* ---------- 57. HOMEPAGE: REGAL WORLD GRID · DIAMONDS VS GOLD · SERVICES ---------- */
.rj-card__types { margin: 0; font-size: .72rem; font-weight: 600; letter-spacing: .08em; line-height: 1.7; color: var(--c-gold); }
@media (max-width: 639px) { .rj-card__types { display: none; } }
@media (min-width: 1024px) {
  .rj-grid-collections--worlds { grid-template-columns: repeat(3, 1fr); gap: 3.5rem 2.5rem; }
  .rj-grid-collections--worlds .rj-card:nth-child(even) { margin-top: 0; }
  .rj-grid-collections--worlds .rj-card:nth-child(3n+2) { margin-top: 4.5rem; }
  .rj-grid-collections--worlds .rj-card:nth-child(n+4) { margin-top: -2rem; }
  .rj-grid-collections--worlds .rj-card:nth-child(5) { margin-top: 2.5rem; }
}

.rj-compare__wrap { margin-inline: auto; max-width: 62rem; overflow-x: auto; }
.rj-compare__table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.rj-compare__table th, .rj-compare__table td { padding: 1.1rem 1rem; border-bottom: 1px solid var(--c-line); text-align: left; vertical-align: top; }
.rj-compare__table thead th { font-family: var(--f-serif); font-size: clamp(1.3rem, 2vw, 1.6rem); font-weight: 500; color: var(--c-charcoal); border-bottom: 1px solid var(--c-gold); }
.rj-compare__table tbody th { width: 9.5rem; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c-gold); }
.rj-compare__table td { color: var(--c-ink); }
@media (max-width: 639px) { /* stack each row: aspect, then diamond / gold */
  .rj-compare__table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .rj-compare__table tr { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; padding: 1rem 0; border-bottom: 1px solid var(--c-line); }
  .rj-compare__table tbody th { grid-column: 1 / -1; width: auto; padding: 0 0 .5rem; border: 0; }
  .rj-compare__table td { padding: 0; border: 0; font-size: .88rem; }
  .rj-compare__table td::before { display: block; margin-bottom: .25rem; font-family: var(--f-serif); font-size: 1.05rem; color: var(--c-charcoal); }
  .rj-compare__table td:nth-of-type(1)::before { content: "Diamond"; }
  .rj-compare__table td:nth-of-type(2)::before { content: "Gold"; }
}

.rj-services { --c-gold: #735830; }
.rj-services__grid { display: grid; grid-template-columns: 1fr; gap: 1.25rem; }
@media (min-width: 768px) { .rj-services__grid { grid-template-columns: 1fr 1fr; gap: 1.5rem; } }
.rj-service { display: flex; flex-direction: column; gap: .9rem; padding: clamp(1.75rem, 3.5vw, 3rem); background: var(--c-ivory); color: inherit; text-decoration: none; border: 1px solid transparent; transition: border-color .4s var(--ease), transform .4s var(--ease); }
.rj-service:hover { border-color: var(--c-gold); }
.rj-service__num { font-family: var(--f-serif); font-size: 1.1rem; color: var(--c-gold); }
.rj-service h3 { font-size: clamp(1.6rem, 2.4vw, 2.1rem); }
.rj-service p { margin: 0; color: var(--c-ink); }
.rj-service__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.rj-service__list li { padding-bottom: .65rem; border-bottom: 1px solid var(--c-line); font-size: .93rem; color: var(--c-ink); }
.rj-service__list strong { display: block; font-weight: 600; color: var(--c-charcoal); }
.rj-service .rj-link { align-self: flex-start; margin-top: auto; }

/* ---------- 58. HOMEPAGE ROUNDED IMAGES (homepage only for now: body.rj-home) ---------- */
/* .rj-round = other pages that have adopted the rounded images (Journal so far) */
.rj-home, .rj-round { --r-img: 14px; }
.rj-home .rj-media, .rj-home .rj-film__end, .rj-round .rj-media { border-radius: var(--r-img); }
.rj-home .rj-media, .rj-round .rj-media { isolation: isolate; } /* keeps scaled/transformed images clipped to the corners */
.rj-home .rj-media--inset, .rj-home .rj-parallax__detail { border-radius: calc(var(--r-img) + 4px); }
.rj-home .rj-arch, .rj-home .rj-arch::after { border-radius: 999px 999px var(--r-img) var(--r-img); }
.rj-home .rj-arch::after { border-bottom-left-radius: calc(var(--r-img) - 6px); border-bottom-right-radius: calc(var(--r-img) - 6px); }
.js .rj-home .rj-unveil { clip-path: inset(0 49.5% 0 49.5% round var(--r-img)); }
@keyframes rj-unveil-r { from { clip-path: inset(0 49.5% 0 49.5% round var(--r-img)); } to { clip-path: inset(0 0 0 0 round var(--r-img)); } }
.js .rj-home .rj-unveil.is-in { animation-name: rj-unveil-r; }
/* edge-to-edge photos: round only the corners that face the page, not the screen edge */
.rj-home .rj-hero__media { border-radius: 0 0 var(--r-img) var(--r-img); }
.rj-home .rj-bridal__image { border-radius: 0; }
@media (min-width: 1024px) {
  .rj-home .rj-hero__media { border-radius: var(--r-img) 0 0 var(--r-img); }
  .rj-home .rj-bridal__image { border-radius: 0 var(--r-img) var(--r-img) 0; }
}
@media (min-width: 1024px) { .rj-home .rj-bridal__hero { background: var(--c-champagne); } }

/* ---------- 59. FULL-SCREEN VIDEO HERO WITH THE HEADER FLOATING OVER IT (homepage, Hero E) ----------
   The top bar and header stay in the page flow; the hero is pulled up beneath them and fills the screen.
   Until the visitor scrolls, the header is transparent with ivory text; after that it is the normal header.
   Elementor: Hero container with negative top margin (= top bar + header) + a transparent header template
   for the homepage (Theme Builder is Pro; free alternative: a "sticky transparent header" plugin or custom CSS). */
:root { --tb: 0px; }
@media (min-width: 1024px) { :root { --tb: 38px; } }
.rj-home:has(.rj-hero-e) .rj-topbar { position: relative; z-index: 101; background: transparent; border-bottom: 1px solid rgba(250, 247, 242, .14); }
.rj-home:has(.rj-hero-e) main > .rj-hero-e { margin-top: calc(-1 * (var(--header-h) + var(--tb)) - 2px); } /* +2px covers the hairline borders */
.rj-home .rj-hero-e__inner { min-height: 100svh; padding-top: calc(var(--header-h) + var(--tb) + 2rem); }
@media (max-width: 767px) { .rj-home .rj-hero-e__inner { min-height: calc(100svh - 60px); } } /* the Call/Directions/Book bar covers the bottom 60px */
.rj-home .rj-hero-e__toggle { top: calc(var(--header-h) + 1rem); }
@media (min-width: 768px) { .rj-home .rj-hero-e__toggle { top: auto; } }
.rj-home .rj-hero-e__shade::after { /* keeps the floating header readable over bright frames */
  content: ""; position: absolute; inset: 0 0 auto; height: 34%;
  background: linear-gradient(180deg, rgba(15, 13, 11, .62) 0%, rgba(15, 13, 11, 0) 100%);
}

.rj-header { transition: border-color .3s var(--ease), box-shadow .3s var(--ease), background-color .35s var(--ease); }
.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled) {
  background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; border-bottom-color: rgba(250, 247, 242, .14);
}
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) :is(.rj-logo, .rj-nav__link, .rj-header__phone, .rj-iconbtn) { color: var(--c-ivory); }
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) .rj-logo__loc,
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) .rj-header__phone svg { color: var(--c-gold-soft); }
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) .rj-nav__link::after { background: var(--c-gold-soft); }
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) .rj-iconbtn { border-color: rgba(250, 247, 242, .4); }
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) .rj-btn--primary { background: var(--c-ivory); color: var(--c-charcoal); border-color: var(--c-ivory); }
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) .rj-btn--primary:hover { background: transparent; color: var(--c-ivory); }
:is(.rj-home:has(.rj-hero-e):not(.nav-open) .rj-header:not(.is-scrolled)) :is(.rj-logo, .rj-nav__link) { text-shadow: 0 1px 10px rgba(15, 13, 11, .35); }

/* ---------- 60. REGAL WORLD MEGA MENU ----------
   Spans the header: six worlds (2 columns) · services · a featured photo card · footer row.
   Opens/closes with the existing dropdown script (.is-open); items fade up in a short stagger. */
.rj-header__inner { position: relative; }
.rj-nav .rj-dropdown { position: static; }
.rj-dropdown__panel.rj-mega {
  top: 100%; left: var(--gutter); right: var(--gutter); min-width: 0;
  display: grid; grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr) 236px; gap: 0 clamp(1.75rem, 3vw, 3rem);
  padding: 2.1rem clamp(1.75rem, 3vw, 2.75rem) 0;
  background: var(--c-ivory); border: 1px solid var(--c-line); border-top: 0; border-radius: 0 0 18px 18px;
  box-shadow: 0 40px 70px -40px rgba(28, 26, 23, .45);
  --c-gold: #735830; /* deeper gold for small text on ivory */
}
.rj-dropdown__panel.rj-mega::before { top: -24px; height: 24px; } /* hover bridge from the nav link */
.rj-dropdown__panel.rj-mega::after { /* gold hairline along the top edge */
  content: ""; position: absolute; top: 0; left: 2rem; right: 2rem; height: 1px;
  background: linear-gradient(90deg, transparent, var(--c-gold-soft) 20%, var(--c-gold-soft) 80%, transparent);
}
.rj-mega__label {
  display: flex; align-items: center; gap: .9rem; margin: 0 0 .6rem;
  font-size: .66rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--c-gold);
}
.rj-mega__label::after { content: ""; flex: 1; height: 1px; background: var(--c-line); }
.rj-mega__list { list-style: none; margin: 0; padding: 0; }
.rj-mega__list--two { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(1.5rem, 2.5vw, 2.5rem); }
.rj-dropdown__panel .rj-mega__link {
  display: grid; grid-template-columns: 2.1rem 1fr; align-items: baseline; padding: .8rem 0;
  border-bottom: 1px solid var(--c-line); background: none; color: inherit; text-decoration: none;
}
.rj-dropdown__panel .rj-mega__link:hover { background: none; }
.rj-mega__num { font-family: var(--f-serif); font-size: .95rem; color: var(--c-gold); opacity: .7; transition: opacity .3s; }
.rj-mega__text { display: block; min-width: 0; }
.rj-mega__name {
  display: inline-block; font-family: var(--f-serif); font-size: 1.32rem; line-height: 1.15; color: var(--c-charcoal);
  transition: color .3s var(--ease), transform .4s var(--ease);
}
.rj-mega__name::after { content: " \2192"; font-family: var(--f-sans); font-size: .8rem; opacity: 0; transition: opacity .3s; }
.rj-mega__desc { display: block; margin-top: .25rem; font-size: .78rem; line-height: 1.45; color: var(--c-muted); }
.rj-mega__link:hover .rj-mega__name, .rj-mega__link:focus-visible .rj-mega__name { color: var(--c-gold); transform: translateX(4px); }
.rj-mega__link:hover .rj-mega__name::after, .rj-mega__link:focus-visible .rj-mega__name::after { opacity: 1; }
.rj-mega__link:hover .rj-mega__num { opacity: 1; }

.rj-dropdown__panel .rj-mega__feature {
  position: relative; display: block; align-self: start; aspect-ratio: 4 / 5; padding: 0; overflow: hidden;
  border-radius: 14px; isolation: isolate; background: var(--c-champagne); color: var(--c-ivory); text-decoration: none;
}
.rj-mega__feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; transition: transform 1.2s var(--ease); }
.rj-mega__feature::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15, 13, 11, .78) 0%, rgba(15, 13, 11, 0) 55%); }
.rj-mega__feature:hover img { transform: scale(1.05); }
.rj-mega__feature-text { position: absolute; z-index: 1; left: 1.1rem; right: 1.1rem; bottom: 1rem; display: grid; gap: .3rem; }
.rj-mega__feature-eyebrow { font-size: .62rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--c-gold-soft); }
.rj-mega__feature-title { font-family: var(--f-serif); font-size: 1.6rem; line-height: 1.05; }
.rj-mega__feature-go { font-size: .68rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(250, 247, 242, .85); }
.rj-mega__feature-go::after { content: " \2192"; }

.rj-mega__foot {
  grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  margin-top: 1.4rem; padding: 1rem 0 1.15rem; border-top: 1px solid var(--c-line);
}
.rj-dropdown__panel .rj-mega__all { display: inline-flex; padding: 0; background: none; font-size: .7rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--c-gold); text-decoration: none; }
.rj-dropdown__panel .rj-mega__all::after { content: "\2192"; margin-left: .5rem; transition: transform .3s var(--ease); }
.rj-dropdown__panel .rj-mega__all:hover::after { transform: translateX(4px); }
.rj-mega__note { font-size: .78rem; color: var(--c-muted); }
.rj-dropdown__panel .rj-mega__note a { display: inline; padding: 0; background: none; font-size: inherit; color: var(--c-ink); }

/* staggered reveal of the items */
.js .rj-mega :is(.rj-mega__list li, .rj-mega__feature, .rj-mega__label) { opacity: 0; transform: translateY(6px); transition: opacity .45s var(--ease), transform .45s var(--ease); }
.js .rj-dropdown.is-open .rj-mega :is(.rj-mega__list li, .rj-mega__feature, .rj-mega__label) { opacity: 1; transform: none; }
.rj-dropdown.is-open .rj-mega__list--two li:nth-child(2) { transition-delay: .03s; }
.rj-dropdown.is-open .rj-mega__list--two li:nth-child(3) { transition-delay: .06s; }
.rj-dropdown.is-open .rj-mega__list--two li:nth-child(4) { transition-delay: .09s; }
.rj-dropdown.is-open .rj-mega__list--two li:nth-child(5) { transition-delay: .12s; }
.rj-dropdown.is-open .rj-mega__list--two li:nth-child(6) { transition-delay: .15s; }
.rj-dropdown.is-open .rj-mega__col--services li { transition-delay: .12s; }
.rj-dropdown.is-open .rj-mega__feature { transition-delay: .18s; }
@media (min-width: 1024px) and (max-width: 1279px) {
  .rj-dropdown__panel.rj-mega { grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr) 190px; }
  .rj-mega__name { font-size: 1.15rem; }
  .rj-mega__desc { font-size: .74rem; }
}
@media (prefers-reduced-motion: reduce) {
  .js .rj-mega :is(.rj-mega__list li, .rj-mega__feature, .rj-mega__label) { opacity: 1; transform: none; transition: none; }
  .rj-mega__name, .rj-mega__feature img { transition: none; }
}

/* ---------- 61. PREMIUM MOBILE MENU (below 1024px) ---------- */
.rj-menu-toggle__close { display: none; }
.rj-menu-toggle[aria-expanded="true"] .rj-menu-toggle__open { display: none; }
.rj-menu-toggle[aria-expanded="true"] .rj-menu-toggle__close { display: block; }
.rj-drawer { --c-gold: #735830; padding: 1.25rem var(--gutter) calc(6.5rem + env(safe-area-inset-bottom)); }
.rj-drawer::before { /* gold hairline under the header */
  content: ""; position: sticky; top: -1.25rem; display: block; height: 1px; margin: -1.25rem calc(-1 * var(--gutter)) 1.25rem;
  background: linear-gradient(90deg, transparent, var(--c-gold-soft) 25%, var(--c-gold-soft) 75%, transparent);
}
.rj-drawer__list > li { border-bottom: 1px solid var(--c-line); }
.rj-drawer__link {
  display: flex; align-items: baseline; gap: .9rem; width: 100%; padding: 1.05rem 0; background: none; border: 0; cursor: pointer;
  font-family: var(--f-serif); font-size: clamp(1.9rem, 8vw, 2.4rem); line-height: 1.05; color: var(--c-charcoal); text-align: left; text-decoration: none;
}
.rj-drawer__link:active { color: var(--c-gold); }
.rj-drawer__num { flex: none; width: 1.6rem; font-family: var(--f-sans); font-size: .68rem; font-weight: 600; letter-spacing: .14em; color: var(--c-gold); transform: translateY(-.35em); }
.rj-drawer__plus { position: relative; flex: none; width: 14px; height: 14px; margin-left: auto; align-self: center; }
.rj-drawer__plus::before, .rj-drawer__plus::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1.5px; background: var(--c-gold); transition: transform .35s var(--ease); }
.rj-drawer__plus::after { transform: rotate(90deg); }
.rj-drawer__toggle[aria-expanded="true"] .rj-drawer__plus::after { transform: rotate(0deg); }
.rj-drawer__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s var(--ease); }
.rj-drawer__group.is-open .rj-drawer__panel { grid-template-rows: 1fr; }
.rj-drawer__panel-inner { overflow: hidden; min-height: 0; }
.rj-drawer__group:not(.is-open) .rj-drawer__panel-inner { visibility: hidden; transition: visibility 0s .45s; }
.no-js .rj-drawer__panel { grid-template-rows: 1fr; }
.no-js .rj-drawer__group .rj-drawer__panel-inner { visibility: visible; }
.rj-dworlds { list-style: none; margin: 0; padding: 0 0 .5rem; display: grid; gap: .15rem; }
.rj-dworld, .rj-dservice { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 1rem; padding: .55rem 0; color: inherit; text-decoration: none; }
.rj-dservice { grid-template-columns: 1fr; padding: .7rem 0; border-bottom: 1px solid var(--c-line); }
.rj-dworlds--services li:last-child .rj-dservice { border-bottom: 0; }
.rj-dworld img { width: 48px; height: 60px; object-fit: cover; border-radius: 999px 999px 6px 6px; background: var(--c-champagne); }
.rj-dworld__name { display: block; font-family: var(--f-serif); font-size: 1.3rem; line-height: 1.15; color: var(--c-charcoal); }
.rj-dworld__desc { display: block; margin-top: .15rem; font-size: .8rem; line-height: 1.4; color: var(--c-muted); }
.rj-dworld:active .rj-dworld__name, .rj-dservice:active .rj-dworld__name { color: var(--c-gold); }
.rj-drawer__label { display: flex; align-items: center; gap: .8rem; margin: .9rem 0 .2rem; font-size: .66rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--c-gold); }
.rj-drawer__label::after { content: ""; flex: 1; height: 1px; background: var(--c-line); }
.rj-drawer__all { display: inline-flex; align-items: center; min-height: 44px; margin: .25rem 0 .75rem; font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--c-gold); text-decoration: none; }
.rj-drawer__all::after { content: "\2192"; margin-left: .5rem; }
.rj-drawer__feature { position: relative; display: block; margin-top: 1.75rem; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 14px; background: var(--c-champagne); color: var(--c-ivory); text-decoration: none; isolation: isolate; }
.rj-drawer__feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rj-drawer__feature::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15, 13, 11, .75) 0%, rgba(15, 13, 11, 0) 60%); }
.rj-drawer__feature-text { position: absolute; z-index: 1; left: 1.1rem; right: 1.1rem; bottom: .95rem; display: grid; gap: .2rem; }
.rj-drawer__feature-eyebrow { font-size: .62rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--c-gold-soft); }
.rj-drawer__feature-title { font-family: var(--f-serif); font-size: 1.55rem; line-height: 1.1; }
.rj-drawer__feature-title::after { content: " \2192"; font-family: var(--f-sans); font-size: .9rem; }
.rj-drawer .rj-btn { width: 100%; margin-top: 1rem; }
.rj-drawer__contact { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--c-line); display: grid; gap: .1rem; font-size: .92rem; }
.rj-drawer__contact a { display: flex; align-items: center; gap: .75rem; min-height: 44px; color: var(--c-ink); text-decoration: none; }
.rj-drawer__contact svg { flex: none; width: 18px; height: 18px; color: var(--c-gold); }
/* entrance: rows fade up in sequence when the menu opens */
.js .rj-drawer :is(.rj-drawer__list > li, .rj-drawer__feature, .rj-btn, .rj-drawer__contact) { opacity: 0; transform: translateY(10px); transition: opacity .5s var(--ease), transform .5s var(--ease); }
.js .rj-drawer.is-open :is(.rj-drawer__list > li, .rj-drawer__feature, .rj-btn, .rj-drawer__contact) { opacity: 1; transform: none; }
.rj-drawer.is-open .rj-drawer__list > li:nth-child(2) { transition-delay: .04s; }
.rj-drawer.is-open .rj-drawer__list > li:nth-child(3) { transition-delay: .08s; }
.rj-drawer.is-open .rj-drawer__list > li:nth-child(4) { transition-delay: .12s; }
.rj-drawer.is-open .rj-drawer__list > li:nth-child(5) { transition-delay: .16s; }
.rj-drawer.is-open .rj-drawer__list > li:nth-child(6) { transition-delay: .2s; }
.rj-drawer.is-open :is(.rj-drawer__feature, .rj-btn, .rj-drawer__contact) { transition-delay: .24s; }
@media (prefers-reduced-motion: reduce) {
  .js .rj-drawer :is(.rj-drawer__list > li, .rj-drawer__feature, .rj-btn, .rj-drawer__contact) { opacity: 1; transform: none; transition: none; }
  .rj-drawer__panel, .rj-drawer__plus::before, .rj-drawer__plus::after { transition: none; }
}

/* ---------- 62. PRODUCT PHOTOS IN THE REGAL WORLD ARCHES ----------
   Store product shots on white: show the whole piece, and let the white melt into a warm cream arch. */
.rj-arch--product { background: radial-gradient(120% 80% at 50% 30%, #FBF8F2 0%, #EFE6D6 100%); }
.rj-arch--product img { object-fit: contain; padding: 14% 10% 10%; mix-blend-mode: multiply; }
.rj-card:hover .rj-arch--product img { transform: scale(1.06); }
/* pendants on long chains: zoom in on the pendant itself */
.rj-arch--zoom img { padding: 0; object-fit: cover; object-position: 50% 80%; scale: 1.75; transform-origin: 50% 78%; }

/* ---------- 63. REGAL WORLD ON THE DARK BACKGROUND (same as Natural Diamonds) ---------- */
.rj-section--dark .rj-card__text { color: rgba(250, 247, 242, .72); }
.rj-section--dark .rj-card__types { color: var(--c-gold-soft); }
.rj-section--dark .rj-arch--product { box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6); } /* lit display windows */