/* ==========================================================================
   RIVERSONG VIBRANT REFRESH
   Site-wide progressive-enhancement layer loaded on every page via
   <link rel="stylesheet" href="/riversongtech/assets/refresh.css">.
   Hooks into existing Ueeshop classes; adds a Gen-Z vibrant theme,
   animated backgrounds, motion, and a set of rsx-* utilities used by
   newly authored content. Layout structure is preserved.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Outfit:wght@300;400;500;600;700;800;900&display=swap');

/* --------------------------------------------------------------------------
   1. Design tokens
   -------------------------------------------------------------------------- */
:root {
  --rs-blue: #0a5cff;
  --rs-indigo: #4f46e5;
  --rs-violet: #7c3aed;
  --rs-magenta: #ec4899;
  --rs-cyan: #22d3ee;
  --rs-lime: #a3e635;
  --rs-amber: #fbbf24;

  --rs-ink: #0b1020;
  --rs-ink-soft: #424867;
  --rs-mist: #6b7390;
  --rs-line: rgba(11, 16, 32, 0.08);
  --rs-paper: #ffffff;

  --rs-grad-hero: linear-gradient(120deg, #0a5cff 0%, #7c3aed 45%, #ec4899 100%);
  --rs-grad-warm: linear-gradient(120deg, #ec4899 0%, #fbbf24 100%);
  --rs-grad-cool: linear-gradient(120deg, #22d3ee 0%, #4f46e5 100%);
  --rs-grad-lime: linear-gradient(120deg, #a3e635 0%, #22d3ee 100%);

  --rs-glow-blue: 0 18px 50px -18px rgba(10, 92, 255, 0.55);
  --rs-glow-magenta: 0 18px 50px -18px rgba(236, 72, 153, 0.5);
  --rs-shadow-card: 0 22px 60px -28px rgba(11, 16, 32, 0.35);

  --rs-radius: 18px;
  --rs-radius-lg: 28px;
  --rs-pill: 999px;

  --rs-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --rs-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  --rs-font-display: 'Space Grotesk', 'Outfit', 'OpenSans-Bold', system-ui, sans-serif;
  --rs-font-body: 'Outfit', 'Opensans-Regular', system-ui, sans-serif;

  /* Background wash stops — refresh.js recolours these from the page's
     product images (see productWash). Defaults: lavender left / pink right. */
  --rsx-wash-left: rgba(196, 181, 253, 0.62);
  --rsx-wash-right: rgba(254, 202, 202, 0.56);

  /* Moving aurora-blob colours, also recoloured from products by productWash. */
  --rsx-c1: rgba(10, 92, 255, 0.85);
  --rsx-c2: rgba(124, 58, 237, 0.80);
  --rsx-c3: rgba(236, 72, 153, 0.70);
  --rsx-c4: rgba(34, 211, 238, 0.70);
}

/* Registered so the wash can fade smoothly when JS swaps the product colours.
   Falls back to an instant swap where @property is unsupported. */
@property --rsx-wash-left {
  syntax: '<color>';
  inherits: true;
  initial-value: rgba(196, 181, 253, 0.62);
}
@property --rsx-wash-right {
  syntax: '<color>';
  inherits: true;
  initial-value: rgba(254, 202, 202, 0.56);
}
@property --rsx-c1 { syntax: '<color>'; inherits: true; initial-value: rgba(10, 92, 255, 0.85); }
@property --rsx-c2 { syntax: '<color>'; inherits: true; initial-value: rgba(124, 58, 237, 0.80); }
@property --rsx-c3 { syntax: '<color>'; inherits: true; initial-value: rgba(236, 72, 153, 0.70); }
@property --rsx-c4 { syntax: '<color>'; inherits: true; initial-value: rgba(34, 211, 238, 0.70); }
:root {
  transition:
    --rsx-wash-left 0.9s var(--rs-ease), --rsx-wash-right 0.9s var(--rs-ease),
    --rsx-c1 1.1s var(--rs-ease), --rsx-c2 1.1s var(--rs-ease),
    --rsx-c3 1.1s var(--rs-ease), --rsx-c4 1.1s var(--rs-ease);
}

/* --------------------------------------------------------------------------
   2. Global polish
   -------------------------------------------------------------------------- */
html { scroll-behavior: smooth; background-color: transparent; }

body {
  font-family: var(--rs-font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background-color: transparent;
  --ThemesBodyColor: transparent;
  --ThemesHeaderBgColor: transparent;
}

/* Symmetrical lavender-left / pink-right wash — site-wide */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  background:
    radial-gradient(ellipse 72% 128% at 0% 46%, var(--rsx-wash-left) 0%, transparent 88%),
    radial-gradient(ellipse 72% 128% at 100% 46%, var(--rsx-wash-right) 0%, transparent 88%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(250, 248, 255, 0.9) 45%, rgba(255, 250, 249, 0.9) 100%);
}

/* Let the gradient show through light Ueeshop section shells */
body .visual_plugins_container,
body [class*="ly_"][data-visual-id]:not(.ly_footer_19):not(.ly_form_4) {
  background: transparent !important;
  background-color: transparent !important;
}

body:not(.rsx-scrolled) .ly_header_19,
body:not(.rsx-scrolled) #header,
body:not(.rsx-scrolled) #header .headerFixed,
body:not(.rsx-scrolled) .themes_global_header,
body:not(.rsx-scrolled) .header_content_height,
body:not(.rsx-scrolled) .header_background .headerFixed {
  background: transparent !important;
  background-color: transparent !important;
}

/* let the fixed aurora show through the custom (transparent) sections */
.rsx-section { background: transparent; }

::selection { background: rgba(124, 58, 237, 0.22); color: var(--rs-ink); }

/* Custom scrollbar */
* { scrollbar-width: thin; scrollbar-color: var(--rs-violet) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb {
  background: var(--rs-grad-hero);
  border-radius: var(--rs-pill);
  border: 2px solid rgba(255, 255, 255, 0.6);
}
*::-webkit-scrollbar-track { background: transparent; }

/* --------------------------------------------------------------------------
   3. Animated aurora background (sits behind page content)
   -------------------------------------------------------------------------- */
.rsx-aurora {
  position: fixed;
  inset: -20vmax;
  z-index: -2;
  pointer-events: none;
  filter: blur(64px) saturate(130%);
  opacity: 0.5;
  transform: none !important;
  /* scroll-velocity pulse — JS sets --rsx-intensity (0..1) as you scroll */
  scale: calc(1 + var(--rsx-intensity, 0) * 0.14);
  transition: scale 0.4s var(--rs-ease), opacity 0.5s var(--rs-ease);
  will-change: scale;
}
.rsx-aurora::before,
.rsx-aurora::after {
  content: '';
  position: absolute;
  width: 60vmax;
  height: 60vmax;
  border-radius: 50%;
  mix-blend-mode: multiply;
  /* mouse parallax — JS sets --rsx-ax/--rsx-ay (px). `translate` is its own
     property, so it composes with the float animation's `transform`. */
  transition: translate 0.5s var(--rs-ease);
}
.rsx-aurora::before {
  background: radial-gradient(circle at 30% 30%, var(--rsx-c1, rgba(10, 92, 255, 0.85)), transparent 60%),
              radial-gradient(circle at 70% 60%, var(--rsx-c2, rgba(124, 58, 237, 0.8)), transparent 60%);
  top: -10vmax; left: -8vmax;
  translate: var(--rsx-ax, 0px) var(--rsx-ay, 0px);
  animation: rsx-float-a 22s var(--rs-ease) infinite alternate;
}
.rsx-aurora::after {
  background: radial-gradient(circle at 40% 40%, var(--rsx-c3, rgba(236, 72, 153, 0.7)), transparent 60%),
              radial-gradient(circle at 60% 70%, var(--rsx-c4, rgba(34, 211, 238, 0.7)), transparent 60%);
  bottom: -12vmax; right: -10vmax;
  translate: calc(var(--rsx-ax, 0px) * -1.25) calc(var(--rsx-ay, 0px) * -1.25);
  animation: rsx-float-b 26s var(--rs-ease) infinite alternate;
}
@keyframes rsx-float-a {
  0%   { transform: translate3d(0,0,0) scale(1); }
  100% { transform: translate3d(8vmax, 6vmax, 0) scale(1.18); }
}
@keyframes rsx-float-b {
  0%   { transform: translate3d(0,0,0) scale(1.1); }
  100% { transform: translate3d(-7vmax, -5vmax, 0) scale(1); }
}

/* fine grain noise overlay for texture */
.rsx-grain {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   4. Scroll progress + page loader + cursor glow
   -------------------------------------------------------------------------- */
.rsx-progress {
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 0%;
  z-index: 99999;
  background: var(--rs-grad-hero);
  box-shadow: 0 0 12px rgba(124, 58, 237, 0.7);
  transition: width 0.1s linear;
}

.rsx-loader {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #060816;
  overflow: hidden;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
.rsx-loader.rsx-done { opacity: 0; visibility: hidden; }

/* First-paint cover: refresh.css is render-blocking in <head>, so this dark
   layer paints before any page content, killing the brief content flash before
   the deferred script mounts the splash. The JS reveals the site (adds
   .rsx-revealed) when the splash finishes, or immediately when it is skipped.
   The failsafe animation reveals the page if the script never runs. */
html::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99990;
  background: #060816;
  pointer-events: none;
  animation: rsx-cover-failsafe 0.4s ease 8s forwards;
}
html.rsx-revealed::before {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
@keyframes rsx-cover-failsafe { to { opacity: 0; visibility: hidden; } }

/* Option 2 - horizontal reveal choreography:
   "RIVERSONG STAR" reveals -> STAR dissipates -> RIVERSONG slides right ->
   STAR pops in ahead of it ("STAR RIVERSONG") -> STAR dissipates ->
   RIVERSONG glides to centre and settles. JS measures widths and feeds the
   --x (translate) and --s (scale) custom properties per phase. */
.rsx-loader__stage {
  position: relative;
  width: 100%;
  min-height: 2em;
}
.rsx-loader__mark {
  font-family: var(--rs-font-display);
  font-weight: 700;
  letter-spacing: 0.3em;
  font-size: clamp(15px, 5vw, 30px);
  text-transform: uppercase;
  background: var(--rs-grad-hero);
  background-size: 220% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: rsx-shimmer 2.6s linear infinite;
}
.rsx-loader__stage .rsx-loader__mark {
  position: absolute;
  left: 50%;
  top: 50%;
  --x: 0px;
  --s: 1;
  white-space: nowrap;
  opacity: 0;
  filter: blur(14px);
  transform: translate(-50%, -50%) translateX(var(--x)) scale(var(--s));
  transition: transform 0.85s var(--rs-ease), opacity 0.5s var(--rs-ease), filter 0.5s var(--rs-ease);
  will-change: transform, opacity, filter;
}
.rsx-loader__mark.is-on { opacity: 1; filter: blur(0); }
@keyframes rsx-shimmer { from { background-position: 0% 50%; } to { background-position: 220% 50%; } }

.rsx-cursor {
  position: fixed;
  top: 0; left: 0;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(124,58,237,0.5), transparent 70%);
  pointer-events: none;
  z-index: 99998;
  transform: translate(-50%, -50%);
  transition: width 0.2s ease, height 0.2s ease, background 0.2s ease;
  mix-blend-mode: multiply;
}
.rsx-cursor.rsx-cursor--active { width: 56px; height: 56px; background: radial-gradient(circle, rgba(236,72,153,0.45), transparent 70%); }

/* --------------------------------------------------------------------------
   5. Header / navigation glass
   -------------------------------------------------------------------------- */
.themes_global_header,
.headerFixed {
  transition: background-color 0.35s var(--rs-ease), backdrop-filter 0.35s var(--rs-ease), box-shadow 0.35s var(--rs-ease), padding 0.35s var(--rs-ease);
}
body.rsx-scrolled .themes_global_header,
body.rsx-scrolled #header .headerFixed,
body.rsx-scrolled .headerFixed,
.headerFixed.rsx-scrolled {
  background: rgba(255, 255, 255, 0.28) !important;
  background-color: rgba(255, 255, 255, 0.28) !important;
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  backdrop-filter: saturate(160%) blur(14px);
  box-shadow: 0 8px 30px -18px rgba(11, 16, 32, 0.25);
}

body.rsx-scrolled .headerFixed,
body.rsx-scrolled .themes_global_header.headerFixed,
body.rsx-scrolled #header .headerFixed {
  position: fixed !important;
  left: 0;
  transform: none;
  width: 100%;
  border-radius: 0;
  top: 0 !important;
  z-index: 9999 !important;
}

.themes_global_header .nav .default_nav > li > a {
  position: relative;
  font-family: var(--rs-font-display);
  font-weight: 500;
  transition: color 0.25s var(--rs-ease);
}
.themes_global_header .nav .default_nav > li > a::after {
  content: '';
  position: absolute;
  left: 0; bottom: -6px;
  width: 100%; height: 2px;
  background: var(--rs-grad-hero);
  border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--rs-ease);
}
.themes_global_header .nav .default_nav > li:hover > a::after { transform: scaleX(1); }

/* icon tools subtle hover */
.themes_global_header .tool > * { transition: transform 0.25s var(--rs-ease-bounce); }
.themes_global_header .tool > *:hover { transform: translateY(-2px) scale(1.08); }

/* injected nav pill (Newsroom / Leadership added by refresh.js) */
.rsx-nav-extra > a { color: inherit; }

/* --------------------------------------------------------------------------
   6. Buttons
   -------------------------------------------------------------------------- */
.themes_box_button,
.carousel_btn,
.i_button .themes_box_button,
.rsx-btn {
  border-radius: var(--rs-pill) !important;
  font-family: var(--rs-font-display) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  transition: transform 0.3s var(--rs-ease-bounce), box-shadow 0.3s var(--rs-ease), background-position 0.5s var(--rs-ease) !important;
  background-size: 180% 180% !important;
  background-position: 0% 50%;
}
.carousel_btn:hover,
.rsx-btn:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: var(--rs-glow-blue);
  background-position: 100% 50% !important;
}

/* primary filled gradient button utility */
.rsx-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 15px 30px;
  border: 0;
  color: #fff !important;
  text-decoration: none !important;
  background-image: var(--rs-grad-hero) !important;
  box-shadow: var(--rs-glow-blue);
  cursor: pointer;
}
.rsx-btn--ghost {
  background-image: none !important;
  color: var(--rs-ink) !important;
  border: 1.5px solid var(--rs-line) !important;
  background: rgba(255,255,255,0.6) !important;
  box-shadow: none;
}
.rsx-btn--ghost:hover { border-color: var(--rs-violet) !important; box-shadow: var(--rs-glow-magenta); }

/* --------------------------------------------------------------------------
   7. Headings / gradient text (site-wide branded titles)
   -------------------------------------------------------------------------- */
.rsx-grad-text,
.rsx-h2,
[class*="ly_carousel_"] .carousel_title.themes_box_title,
.themes_box_title:not(.themes_box_content),
.ly_news_22 .txt_title,
.ly_news_detail_2 .top_title.themes_box_title,
.article_title.themes_box_title,
.ly_poster_6 .top_title.themes_box_title,
.ly_product_list_2 .list_wrapper .top_title h1,
.rsx-article h3 {
  background: var(--rs-grad-hero) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
.rsx-grad-text,
[class*="ly_carousel_"] .carousel_title.themes_box_title,
.themes_box_title:not(.themes_box_content),
.ly_news_22 .txt_title,
.ly_news_detail_2 .top_title.themes_box_title,
.article_title.themes_box_title,
.ly_product_list_2 .list_wrapper .top_title h1 {
  font-family: var(--rs-font-display) !important;
  letter-spacing: -0.02em;
}
.rsx-grad-text { font-weight: 800; }
.themes_box_title:not(.themes_box_content) a,
a.themes_box_title:not(.themes_box_content) {
  background: var(--rs-grad-hero) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

/* Photo heroes — skip gradient; use high-contrast light type + scrim */
.ly_carousel_1[data-visual-id="71268"] .carousel_wrapper .carousel_box .carousel_item.Carousel-3::after {
  background-color: rgba(5, 8, 20, 0.48) !important;
}
.ly_carousel_1[data-visual-id="71268"] .carousel_wrapper .carousel_box .carousel_item.Carousel-3 .carousel_info {
  z-index: 12;
}
.ly_carousel_1[data-visual-id="71268"] .carousel_wrapper .carousel_box .carousel_item.Carousel-3 .carousel_title.themes_box_title {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #ffffff !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.95),
    0 6px 28px rgba(0, 0, 0, 0.8),
    0 0 48px rgba(0, 0, 0, 0.55);
}

/* --------------------------------------------------------------------------
   8. Product cards
   -------------------------------------------------------------------------- */
.themes_prod {
  border-radius: var(--rs-radius);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.7);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 10px 30px -22px rgba(11,16,32,0.4);
  transition: transform 0.4s var(--rs-ease), box-shadow 0.4s var(--rs-ease);
  position: relative;
  isolation: isolate;
}
.themes_prod::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1.5px;
  background: var(--rs-grad-hero);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.4s var(--rs-ease);
  z-index: 1;
}
.themes_prod:hover { transform: translateY(-8px); box-shadow: var(--rs-shadow-card); }
.themes_prod:hover::before { opacity: 1; }
.themes_prod .pic_box img { transition: transform 0.6s var(--rs-ease); }
.themes_prod:hover .pic_box img { transform: scale(1.06); }
.themes_prod .name a { font-family: var(--rs-font-display); font-weight: 600; transition: color 0.25s ease; }
.themes_prod:hover .name a { color: var(--rs-violet); }

/* Per-card product glow — refresh.js sets --rsx-card-rgb ("r,g,b") from each
   card's own image and appends a .rsx-glow-fx spotlight that follows the
   cursor (--rsx-gx/--rsx-gy) and breathes when idle. Works on product,
   poster, and news cards, driven by whatever image the card shows. */
.rsx-glow { position: relative; isolation: isolate; }
.rsx-glow .rsx-glow-fx {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 3;
  background: radial-gradient(58% 58% at var(--rsx-gx, 50%) var(--rsx-gy, 50%),
              rgba(var(--rsx-card-rgb, 124, 58, 237), 0.62),
              rgba(var(--rsx-card-rgb, 124, 58, 237), 0.18) 42%,
              transparent 68%);
  mix-blend-mode: soft-light;
  opacity: 0.8;
  transition: opacity 0.45s var(--rs-ease);
  animation: rsx-glow-breathe 7s var(--rs-ease) infinite;
}
.rsx-glow:hover .rsx-glow-fx { animation: none; opacity: 1; }
@keyframes rsx-glow-breathe {
  0%, 100% { transform: scale(1);    opacity: 0.66; }
  50%      { transform: scale(1.14); opacity: 0.96; }
}

.themes_prod.rsx-glow,
.poster_item.rsx-glow,
.themes_news.item_box.rsx-glow {
  /* omnidirectional colour bleed (all four sides) + a soft grounding shadow,
     so each card's own colour leaks into the aurora wash on every edge */
  box-shadow: 0 0 60px -6px rgba(var(--rsx-card-rgb), 0.50),
              0 18px 52px -18px rgba(var(--rsx-card-rgb), 0.50);
  transition: box-shadow 0.45s var(--rs-ease), transform 0.4s var(--rs-ease);
}
.themes_prod.rsx-glow:hover,
.poster_item.rsx-glow:hover,
.themes_news.item_box.rsx-glow:hover {
  box-shadow: 0 0 92px -4px rgba(var(--rsx-card-rgb), 0.74),
              0 28px 72px -18px rgba(var(--rsx-card-rgb), 0.66);
}
.themes_prod.rsx-glow::before {
  background: linear-gradient(135deg, rgba(var(--rsx-card-rgb), 1), rgba(var(--rsx-card-rgb), 0.25) 55%, transparent);
}

/* --------------------------------------------------------------------------
   9. News cards (homepage + newsroom)
   -------------------------------------------------------------------------- */
.news_box .themes_news.item_box {
  border-radius: var(--rs-radius-lg) !important;
  overflow: hidden;
  background: rgba(255,255,255,0.78) !important;
  box-shadow: 0 14px 40px -26px rgba(11,16,32,0.45);
  transition: transform 0.4s var(--rs-ease), box-shadow 0.4s var(--rs-ease) !important;
}
.news_box .themes_news.item_box:hover { transform: translateY(-8px) !important; box-shadow: var(--rs-shadow-card) !important; }
.news_box .themes_news .img_box { overflow: hidden; }
.news_box .themes_news .img_box img { transition: transform 0.6s var(--rs-ease) !important; }
.news_box .themes_news.item_box:hover .img_box img { transform: scale(1.07) !important; }
.ly_news_22[data-visual-id="71269"] .news_box .themes_news.item_box {
  display: flex;
  flex-direction: column;
}
.ly_news_22[data-visual-id="71269"] .news_box .themes_news .info_box {
  flex: 1;
  position: relative;
  z-index: 2;
  margin-top: -6px;
  padding-top: 22px !important;
}
.news_box .item_box .info_box .i_title a,
.news_box .item_box .info_box .info_title a { font-family: var(--rs-font-display); transition: color 0.25s ease; }
.news_box .item_box:hover .info_box .i_title a,
.news_box .item_box:hover .info_box .info_title a { color: var(--rs-violet); }
.news_box .themes_news .img_box img.rsx-fill.rsx-fill-ceo {
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1) !important;
}
.news_box .themes_news.item_box:hover .img_box img.rsx-fill.rsx-fill-ceo {
  transform: scale(1.04) !important;
}
/* Egypt 8-years card: full-bleed width (newsroom uses contain on other cards) */
.news_box .themes_news.egypt-card .img_box {
  margin: 0 !important;
  padding: 0 !important;
}
.ly_news_24 .news_box .themes_news.egypt-card .img_box {
  border-radius: 0 !important;
}
.news_box .themes_news.egypt-card .img_box img.rsx-fill.rsx-fill-egypt {
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1.05) !important;
  transition: transform 0.35s var(--rs-ease) !important;
}
.news_box .themes_news.egypt-card.item_box:hover .img_box img.rsx-fill.rsx-fill-egypt {
  transform: scale(1.09) !important;
}
/* Homepage news section now has two cards: center them in the grid */
@media screen and (min-width: 1001px) {
  .ly_news_22[data-visual-id="71269"] .news_box {
    grid-template-columns: repeat(2, calc((100% - 30px) / 3)) !important;
    justify-content: center !important;
  }
}
/* The inline theme style hardcodes .wide to 1760px, which overflows and clips
   the second card on windows narrower than 1760px. Make it fluid instead. */
.ly_news_22[data-visual-id="71269"] .wide {
  width: auto !important;
  max-width: 1760px;
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(20px, 4vw, 60px);
  padding-right: clamp(20px, 4vw, 60px);
  box-sizing: border-box;
}
/* newsroom card date pill */
.ly_news_24 .item_box .info_box .info_date { color: var(--rs-violet) !important; font-family: var(--rs-font-display); font-weight: 600; }
/* --------------------------------------------------------------------------
   10. Footer
   -------------------------------------------------------------------------- */
.ly_footer_19 {
  position: relative;
  background:
    radial-gradient(900px 400px at 12% 0%, rgba(10,92,255,0.18), transparent 60%),
    radial-gradient(900px 400px at 88% 20%, rgba(236,72,153,0.16), transparent 60%),
    #05060f !important;
}
.ly_footer_19 .follow_us_list i {
  background: var(--rs-grad-hero) !important;
  color: #fff !important;
  transition: transform 0.3s var(--rs-ease-bounce), box-shadow 0.3s var(--rs-ease);
}
.ly_footer_19 .follow_us_list li a:hover i { transform: translateY(-4px) rotate(-6deg); box-shadow: var(--rs-glow-magenta); }
.ly_footer_19 .menu_list.menu_list_newsletter .default_newsletter_form .subscribe { background: var(--rs-grad-hero) !important; border-radius: var(--rs-pill) !important; }
.ly_footer_19 .menu_list.menu_list_newsletter .default_newsletter_form .text { border-radius: var(--rs-pill) !important; }

/* --------------------------------------------------------------------------
   11. Article + breadcrumb (press / CEO pages)
   -------------------------------------------------------------------------- */
.bread_crumb { font-family: var(--rs-font-body); }
.bread_crumb a { transition: color 0.2s ease; }
.bread_crumb a:hover { color: var(--rs-violet); }

.ly_news_detail_2 .top_title.themes_box_title {
  font-family: var(--rs-font-display);
  letter-spacing: -0.02em;
}
.ly_news_detail_2 #global_editor_contents,
.ly_news_detail_2 .contents { font-family: var(--rs-font-body); font-size: 17px; line-height: 1.85; color: var(--rs-ink-soft); }
.ly_news_detail_2 .contents h2,
.ly_news_detail_2 .contents h3 { font-family: var(--rs-font-display); color: var(--rs-ink); }

/* --------------------------------------------------------------------------
   12. Reveal-on-scroll utilities (toggled by refresh.js)
   -------------------------------------------------------------------------- */
[data-rsx-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity 0.8s var(--rs-ease), transform 0.8s var(--rs-ease);
  will-change: opacity, transform;
}
[data-rsx-reveal="left"]  { transform: translateX(-44px); }
[data-rsx-reveal="right"] { transform: translateX(44px); }
[data-rsx-reveal="zoom"]  { transform: scale(0.92); }
[data-rsx-reveal].rsx-in { opacity: 1; transform: none; }
[data-rsx-stagger] > * { opacity: 0; transform: translateY(28px); transition: opacity 0.7s var(--rs-ease), transform 0.7s var(--rs-ease); }
[data-rsx-stagger].rsx-in > * { opacity: 1; transform: none; }

/* parallax media */
[data-rsx-parallax] { will-change: transform; }

/* --------------------------------------------------------------------------
   13. rsx components for new content sections
   -------------------------------------------------------------------------- */
.rsx-section { position: relative; padding: clamp(60px, 9vw, 130px) 20px; }
.rsx-wrap { width: min(1180px, 92%); margin: 0 auto; }
.rsx-center { text-align: center; }

.rsx-eyebrow {
  display: inline-block;
  font-family: var(--rs-font-display);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  padding: 8px 16px;
  border-radius: var(--rs-pill);
  color: var(--rs-violet);
  background: rgba(124, 58, 237, 0.1);
  margin-bottom: 18px;
}
.rsx-title {
  font-family: var(--rs-font-display);
  font-weight: 800;
  font-size: clamp(30px, 5.2vw, 64px);
  line-height: 1.04;
  letter-spacing: -0.03em;
  color: var(--rs-ink);
  margin: 0 0 18px;
}
.rsx-lead { font-size: clamp(16px, 2vw, 21px); line-height: 1.65; color: var(--rs-mist); max-width: 60ch; }
.rsx-center .rsx-lead { margin-inline: auto; }

/* stats band */
.rsx-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 18px;
}
.rsx-stat {
  border-radius: var(--rs-radius-lg);
  padding: 32px 26px;
  background: rgba(255,255,255,0.7);
  border: 1px solid var(--rs-line);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 16px 40px -30px rgba(11,16,32,0.5);
}
.rsx-stat__num {
  font-family: var(--rs-font-display);
  font-weight: 800;
  font-size: clamp(34px, 5vw, 58px);
  line-height: 1;
  background: var(--rs-grad-hero);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.rsx-stat__label { margin-top: 10px; color: var(--rs-mist); font-size: 15px; }

/* feature / value cards grid */
.rsx-grid { display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.rsx-card {
  position: relative;
  border-radius: var(--rs-radius-lg);
  padding: 30px;
  background: rgba(255,255,255,0.72);
  border: 1px solid var(--rs-line);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 18px 50px -34px rgba(11,16,32,0.5);
  transition: transform 0.4s var(--rs-ease), box-shadow 0.4s var(--rs-ease);
  overflow: hidden;
}
.rsx-card:hover { transform: translateY(-6px); box-shadow: var(--rs-shadow-card); }
.rsx-card__icon {
  width: 54px; height: 54px;
  border-radius: 16px;
  display: grid; place-items: center;
  font-size: 26px;
  color: #fff;
  background: var(--rs-grad-hero);
  margin-bottom: 18px;
  box-shadow: var(--rs-glow-blue);
}
.rsx-card h3 { font-family: var(--rs-font-display); font-size: 21px; margin: 0 0 10px; color: var(--rs-ink); }
.rsx-card p { color: var(--rs-mist); line-height: 1.6; margin: 0; }
.rsx-card--cool .rsx-card__icon { background: var(--rs-grad-cool); }
.rsx-card--warm .rsx-card__icon { background: var(--rs-grad-warm); }
.rsx-card--lime .rsx-card__icon { background: var(--rs-grad-lime); }

/* CTA band */
.rsx-cta {
  position: relative;
  isolation: isolate;
  border-radius: clamp(20px, 3.5vw, 36px);
  padding: clamp(36px, 7vw, 84px) clamp(22px, 6vw, 80px);
  text-align: center;
  color: #fff;
  background:
    linear-gradient(120deg, #0a5cff 0%, #4f46e5 32%, #7c3aed 60%, #ec4899 100%);
  background-size: 200% 200%;
  overflow: hidden;
  box-shadow: 0 30px 80px -32px rgba(124, 58, 237, 0.6);
  animation: rsx-cta-shift 14s var(--rs-ease) infinite alternate;
}
/* soft top-left sheen */
.rsx-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(640px 320px at 18% 8%, rgba(255,255,255,0.32), transparent 60%),
    radial-gradient(520px 360px at 88% 96%, rgba(34, 211, 238, 0.28), transparent 62%);
  pointer-events: none;
}
/* floating glow orbs */
.rsx-cta::after {
  content: '';
  position: absolute;
  z-index: -1;
  width: 46%;
  aspect-ratio: 1;
  right: -8%;
  top: -28%;
  background: radial-gradient(circle, rgba(255,255,255,0.45), transparent 65%);
  border-radius: 50%;
  filter: blur(8px);
  pointer-events: none;
  animation: rsx-cta-float 9s ease-in-out infinite alternate;
}
.rsx-cta__inner { position: relative; z-index: 1; max-width: 760px; margin: 0 auto; }
.rsx-cta h2 {
  font-family: var(--rs-font-display);
  font-weight: 800;
  line-height: 1.06;
  font-size: clamp(26px, 5.4vw, 52px);
  letter-spacing: -0.01em;
  margin: 0 0 16px;
  text-wrap: balance;
}
.rsx-cta p {
  font-size: clamp(15px, 2vw, 19px);
  line-height: 1.55;
  opacity: 0.94;
  margin: 0 auto clamp(26px, 4vw, 34px);
  max-width: 52ch;
}
.rsx-cta__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
}
.rsx-cta__actions .rsx-btn {
  flex: 0 1 auto;
  justify-content: center;
  min-width: 190px;
  max-width: 100%;
  box-sizing: border-box;
}
/* solid white primary on the coloured band */
.rsx-cta__primary.rsx-btn {
  background: #fff !important;
  background-image: none !important;
  color: var(--rs-ink) !important;
  box-shadow: 0 14px 32px -12px rgba(0,0,0,0.45);
}
.rsx-cta__primary.rsx-btn:hover {
  box-shadow: 0 18px 40px -12px rgba(0,0,0,0.55);
  background: #fff !important;
}
/* glass ghost button */
.rsx-cta__ghost.rsx-btn {
  background: rgba(255,255,255,0.14) !important;
  background-image: none !important;
  color: #fff !important;
  border: 1.5px solid rgba(255,255,255,0.55) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  box-shadow: none;
}
.rsx-cta__ghost.rsx-btn:hover {
  background: rgba(255,255,255,0.26) !important;
  border-color: rgba(255,255,255,0.85) !important;
  box-shadow: 0 12px 30px -14px rgba(0,0,0,0.4);
}

@keyframes rsx-cta-shift {
  from { background-position: 0% 50%; }
  to   { background-position: 100% 50%; }
}
@keyframes rsx-cta-float {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to   { transform: translate3d(-24px, 26px, 0) scale(1.12); }
}

/* stack the buttons full-width on phones */
@media (max-width: 560px) {
  .rsx-cta__actions { flex-direction: column; align-items: stretch; }
  .rsx-cta__actions .rsx-btn { width: 100%; min-width: 0; }
}

/* marquee */
.rsx-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.rsx-marquee__track { display: flex; gap: 56px; width: max-content; animation: rsx-marquee 32s linear infinite; align-items: center; }
.rsx-marquee:hover .rsx-marquee__track { animation-play-state: paused; }
.rsx-marquee__track span { font-family: var(--rs-font-display); font-weight: 700; font-size: clamp(22px, 3vw, 40px); color: var(--rs-ink); opacity: 0.18; white-space: nowrap; display: inline-flex; align-items: center; gap: 56px; }
.rsx-marquee__track span::after { content: '✦'; color: var(--rs-violet); opacity: 0.9; }
@keyframes rsx-marquee { to { transform: translateX(-50%); } }

/* --------------------------------------------------------------------------
   Partner logo wall (homepage "Business Partner" section)
   Two rows of brand cards auto-scroll in opposite directions, pause on hover.
   -------------------------------------------------------------------------- */
.ly_brands_7 .list {
  display: block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  padding: 30px 0 8px !important;
}
.rsx-partners { display: flex; flex-direction: column; gap: 0; }
.rsx-plogo-row {
  overflow: hidden;
  padding: 14px 0 26px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
.rsx-plogo-track {
  display: flex;
  width: max-content;
  gap: 22px;
  align-items: stretch;
  will-change: transform;
}
.rsx-plogo-row--ltr .rsx-plogo-track { animation: rsx-plogo-scroll 58s linear infinite; }
.rsx-plogo-row--rtl .rsx-plogo-track { animation: rsx-plogo-scroll 66s linear infinite reverse; }
.rsx-plogo-row:hover .rsx-plogo-track { animation-play-state: paused; }
@keyframes rsx-plogo-scroll { to { transform: translateX(-50%); } }

.rsx-plogo {
  flex: 0 0 auto;
  width: clamp(140px, 15vw, 188px);
  height: clamp(78px, 9vw, 104px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 22px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid rgba(9, 34, 46, 0.07);
  border-radius: 18px;
  box-shadow: 0 1px 2px rgba(9, 34, 46, 0.04), 0 10px 26px -18px rgba(9, 34, 46, 0.28);
  transition: transform 0.45s var(--rs-ease), box-shadow 0.45s var(--rs-ease), border-color 0.45s var(--rs-ease);
}
.rsx-plogo img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  opacity: 0.9;
  filter: saturate(0.92);
  transition: opacity 0.45s var(--rs-ease), filter 0.45s var(--rs-ease);
}
.rsx-plogo:hover {
  transform: translateY(-6px);
  border-color: rgba(124, 58, 237, 0.35);
  box-shadow: 0 1px 2px rgba(9, 34, 46, 0.05), 0 22px 44px -20px rgba(124, 58, 237, 0.45);
}
.rsx-plogo:hover img { opacity: 1; filter: none; }

@media (max-width: 1000px) {
  .ly_brands_7 .list { padding: 18px 0 6px !important; }
  .rsx-partners { gap: 0; }
  .rsx-plogo-row { padding: 10px 0 20px; }
  .rsx-plogo-track { gap: 14px; }
  .rsx-plogo { width: 124px; height: 70px; padding: 12px 16px; border-radius: 14px; }
}

/* chips */
.rsx-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.rsx-chip { font-family: var(--rs-font-display); font-size: 13px; font-weight: 600; padding: 8px 16px; border-radius: var(--rs-pill); background: rgba(10,92,255,0.08); color: var(--rs-blue); border: 1px solid rgba(10,92,255,0.15); }

/* timeline (CEO journey) */
.rsx-timeline { position: relative; margin-top: 40px; padding-left: 28px; }
.rsx-timeline::before { content: ''; position: absolute; left: 6px; top: 6px; bottom: 6px; width: 2px; background: var(--rs-grad-hero); border-radius: 2px; }
.rsx-tl-item { position: relative; padding: 0 0 34px 30px; }
.rsx-tl-item::before { content: ''; position: absolute; left: -23px; top: 4px; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--rs-violet); box-shadow: 0 0 0 4px rgba(124,58,237,0.15); }
.rsx-tl-item .rsx-tl-year { font-family: var(--rs-font-display); font-weight: 700; color: var(--rs-violet); font-size: 14px; letter-spacing: 0.1em; }
.rsx-tl-item h4 { font-family: var(--rs-font-display); margin: 4px 0 6px; color: var(--rs-ink); font-size: 19px; }
.rsx-tl-item p { margin: 0; color: var(--rs-mist); line-height: 1.6; }

/* pull quote */
.rsx-quote {
  font-family: var(--rs-font-display);
  font-weight: 600;
  font-size: clamp(22px, 3.4vw, 38px);
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--rs-ink);
  border-left: 4px solid transparent;
  border-image: var(--rs-grad-hero) 1;
  padding-left: 24px;
  margin: 30px 0;
}

/* immersive hero for new standalone pages */
.rsx-hero {
  position: relative;
  padding: clamp(120px, 18vw, 220px) 20px clamp(60px, 9vw, 110px);
  text-align: center;
  overflow: hidden;
}
.rsx-hero__glow { position: absolute; inset: 0; z-index: -1; background: radial-gradient(700px 360px at 50% 0%, rgba(124,58,237,0.22), transparent 60%); }
.rsx-hero .rsx-title { font-size: clamp(38px, 8vw, 96px); }

/* split media + text */
.rsx-split { display: grid; gap: clamp(28px, 5vw, 64px); align-items: center; grid-template-columns: 1fr 1fr; }
.rsx-split__media { border-radius: var(--rs-radius-lg); overflow: hidden; box-shadow: var(--rs-shadow-card); }
.rsx-split__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 860px) { .rsx-split { grid-template-columns: 1fr; } }

/* portrait band for CEO */
.rsx-portrait { border-radius: var(--rs-radius-lg); overflow: hidden; position: relative; box-shadow: var(--rs-glow-blue); }
.rsx-portrait::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(5,6,15,0.35)); }
.rsx-portrait img { width: 100%; display: block; }

/* --------------------------------------------------------------------------
   14. Compatibility layer for previously authored rsx content
   (product detail pages + press/CEO articles authored before this refresh)
   -------------------------------------------------------------------------- */
:root {
  --rsx-paper: #ffffff;
  --rsx-mist: #eef0fb;
  --rsx-ink: var(--rs-ink);
}

.rsx-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
@media (max-width: 860px) { .rsx-grid-2 { grid-template-columns: 1fr; } }

.rsx-h2 {
  font-family: var(--rs-font-display);
  font-weight: 800;
  font-size: clamp(30px, 5vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--rs-ink);
  margin: 10px 0 16px;
}

.rsx-keyfacts { display: flex; flex-wrap: wrap; gap: 14px; }
.rsx-kf {
  flex: 1 1 120px;
  min-width: 110px;
  padding: 16px 18px;
  border-radius: var(--rs-radius);
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--rs-line);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow: 0 14px 36px -30px rgba(11, 16, 32, 0.5);
}
.rsx-kf b {
  display: block;
  font-family: var(--rs-font-display);
  font-weight: 800;
  font-size: clamp(20px, 2.6vw, 28px);
  background: var(--rs-grad-hero);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.rsx-kf span { display: block; margin-top: 4px; font-size: 13px; color: var(--rs-mist); }

.rsx-arrow { display: inline-block; transition: transform 0.3s var(--rs-ease); }
.rsx-btn:hover .rsx-arrow { transform: translateX(4px); }

.rsx-article { font-family: var(--rs-font-body); color: var(--rs-ink-soft); }
.rsx-article h3 { font-family: var(--rs-font-display); color: var(--rs-ink); font-size: clamp(22px, 3vw, 30px); margin: 34px 0 12px; }
.rsx-article p { font-size: 17px; line-height: 1.85; margin: 0 0 16px; }
.rsx-article__lede { font-size: clamp(18px, 2.2vw, 22px) !important; line-height: 1.6 !important; color: var(--rs-ink) !important; font-weight: 500; }
.rsx-article ul { margin: 0 0 16px; padding-left: 1.2em; }
.rsx-article li { font-size: 17px; line-height: 1.7; margin-bottom: 8px; }
.rsx-article a { color: var(--rs-blue); text-decoration: underline; text-underline-offset: 3px; }
.rsx-article a:hover { color: var(--rs-violet); }

/* About Riversong (contact-us / About Us page) */
.ly_article_1[data-visual-id="71232"] {
  background: transparent !important;
  padding-top: 72px !important;
  padding-bottom: 88px !important;
}
.ly_article_1[data-visual-id="71232"] .article_content_box,
.ly_article_1[data-visual-id="71232"] .article_content,
.ly_article_1[data-visual-id="71232"] .wide {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}
.ly_article_1[data-visual-id="71232"] .article_title {
  font-family: var(--rs-font-display);
  font-size: clamp(28px, 4vw, 42px) !important;
  line-height: 1.15 !important;
  padding-bottom: 28px !important;
  letter-spacing: -0.02em;
}
.rsx-about-copy {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 24px;
  text-align: center;
}
.rsx-about-copy p {
  font-family: var(--rs-font-body);
  font-size: clamp(17px, 2vw, 19px);
  line-height: 1.85;
  color: var(--rs-ink-soft);
  margin: 0 0 18px;
}
.rsx-about-copy p:last-child { margin-bottom: 0; }
.rsx-about-copy__lede {
  font-size: clamp(18px, 2.4vw, 22px) !important;
  line-height: 1.65 !important;
  color: var(--rs-ink) !important;
  font-weight: 500;
}

/* Brand Culture — keep aurora gradient flowing from About Riversong */
.ly_poster_6[data-visual-id="71271"] {
  background: transparent !important;
  background-color: transparent !important;
}
.ly_poster_6[data-visual-id="71271"] .wide {
  background: transparent !important;
}

/* Contact Us form hero — solid white title on dark photo background */
.ly_form_4[data-visual-id="71261"] .form_wrapper .form_box .form_title.themes_box_title {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #ffffff !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.85),
    0 6px 24px rgba(0, 0, 0, 0.55);
}

/* --------------------------------------------------------------------------
   16. Image edge blend — feathered edges + colour-matched ambient bleed
   refresh.js samples each photo's dominant colour into --rsx-edge-rgb on its
   frame, feathers the picture's hard rectangular edge to transparent, and
   leaks a soft glow of that same colour outward so every image melts into the
   aurora background and into its neighbours. Reversible: drop the .rsx-edge /
   .rsx-edge-img classes (or the edgeBlend() call in refresh.js) to roll back.
   -------------------------------------------------------------------------- */

/* feather the actual picture: fully opaque in the middle, fading to
   transparent on all four edges so the rectangle dissolves into whatever
   sits behind it (the gradient wash, or the card's own colour bleed). */
.rsx-edge-img {
  -webkit-mask-image:
    linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 7%, #000 93%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 7%, #000 93%, transparent 100%);
  mask-composite: intersect;
}

/* left/right-only feather for stacked content images (product story slices,
   article bodies): blends the side edges into the gradient while keeping any
   vertical seam between consecutive images tight, so a continuous composition
   split across several images stays continuous. */
.rsx-edge-img--sides {
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 4%, #000 96%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, #000 4%, #000 96%, transparent 100%);
}

/* gentler feather for tall portraits / hero photos with edge content */
.rsx-edge-img--soft {
  -webkit-mask-image:
    linear-gradient(to right, transparent 0%, #000 4%, #000 96%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 4%, #000 96%, transparent 100%);
  mask-image:
    linear-gradient(to right, transparent 0%, #000 4%, #000 96%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 4%, #000 96%, transparent 100%);
}

/* rounded frame + colour-matched ambient bleed for media that the card glow
   layer doesn't already cover (hero carousels, split media, portraits). */
.rsx-edge {
  border-radius: var(--rs-radius-lg);
}
.rsx-edge:not(.rsx-glow) {
  box-shadow:
    0 0 72px -8px rgba(var(--rsx-edge-rgb, 124, 58, 237), 0.46),
    0 18px 54px -20px rgba(var(--rsx-edge-rgb, 124, 58, 237), 0.42);
  transition: box-shadow 0.6s var(--rs-ease);
}

/* Article body panels (press / leadership / sustainability pages): the theme
   wraps the copy in a hard-edged white box that cuts against the gradient.
   Drop the panel so the text floats on the aurora wash like the rest of the
   site, leaving no hard transition between the gradient and the text. */
.ly_news_detail_2 .bottom_detail,
.ly_news_detail_2 .bottom_detail > .contents,
.ly_news_detail_2 #global_editor_contents,
.ly_news_detail_2 #global_editor_contents.editor_txt {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* --------------------------------------------------------------------------
   15. Accessibility / motion + responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1000px) {
  .rsx-cursor { display: none; }
  .rsx-aurora { opacity: 0.42; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .rsx-aurora::before, .rsx-aurora::after,
  .rsx-marquee__track, .rsx-loader__mark, .rsx-plogo-track,
  .rsx-cta, .rsx-cta::after { animation: none !important; }
  .rsx-plogo-track { flex-wrap: wrap; width: 100%; justify-content: center; }
  .rsx-plogo[aria-hidden="true"] { display: none; }
  .rsx-plogo-row { -webkit-mask-image: none; mask-image: none; }
  html.rsx-revealed::before { transition: none !important; }
  [data-rsx-reveal], [data-rsx-stagger] > * { opacity: 1 !important; transform: none !important; transition: none !important; }
  .themes_prod, .news_box .themes_news.item_box, .rsx-card, .rsx-btn, .carousel_btn { transition: none !important; }
}
