:root {
  --bg: #021d2f;
  --surface: #082b41;
  --text: #eaf7fd;
  --muted: #9cc2d4;
  --accent: #28a8be;
  --accent-2: #6fd6e7;
  --line: rgba(180, 226, 242, 0.28);
  --card-shadow: 0 12px 28px rgba(2, 16, 28, 0.24);
  --footer-height: 4rem;
  --footer-height-mobile: 6rem;
  --footer-runtime-height: var(--footer-height);
  --heading-font: "Avenir Next", "Trebuchet MS", "Gill Sans", sans-serif;
  --body-font: "IBM Plex Sans", "Segoe UI", "Helvetica Neue", sans-serif;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  background: radial-gradient(circle at top right, #0d3650 0%, #021b2b 45%, #01101c 100%);
  color: var(--text);
  font-family: var(--body-font);
  isolation: isolate;
  min-height: 100vh;
  overflow-x: hidden;
  position: relative;
}

a {
  color: inherit;
}

.scroll-progress {
  background: transparent;
  height: 0.2rem;
  inset: 0 auto auto 0;
  pointer-events: none;
  position: fixed;
  width: 100%;
  z-index: 170;
}

.scroll-progress-fill {
  background: linear-gradient(90deg, #5ed7ea 0%, #7ee4da 40%, #8ab8f3 100%);
  box-shadow: 0 0 10px rgba(92, 211, 235, 0.42);
  display: block;
  height: 100%;
  transform: scaleX(0);
  transform-origin: 0 50%;
  will-change: transform;
}

.floating-bg-logo {
  /* Decorative watermark drifting behind all page content. */
  background-image: url("../images/favicon.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  filter: drop-shadow(0 8px 24px rgba(3, 19, 28, 0.35));
  height: clamp(12rem, 25vw, 24rem);
  left: 50%;
  mix-blend-mode: screen;
  opacity: 0.12;
  pointer-events: none;
  position: fixed;
  top: 50%;
  transform: translate(-50%, -50%);
  will-change: transform, opacity;
  width: clamp(12rem, 25vw, 24rem);
  z-index: 1;
}

.ocean-bubbles {
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  position: fixed;
  z-index: 2;
}

.ocean-bubble {
  --bubble-size: 10px;
  --bubble-left: 50vw;
  --bubble-rise: 95vh;
  --bubble-drift: 0px;
  --bubble-sway: 8px;
  --bubble-opacity: 0.1;
  --bubble-duration: 20s;
  --bubble-delay: 0s;
  --bubble-swirl-duration: 5s;
  --bubble-twist: 11deg;
  animation: rlBubbleRise var(--bubble-duration) linear var(--bubble-delay) infinite;
  bottom: calc(-1 * var(--bubble-size) - 12vh);
  height: var(--bubble-size);
  left: var(--bubble-left);
  opacity: 0;
  position: absolute;
  width: var(--bubble-size);
  will-change: transform, opacity;
  z-index: 1;
}

.ocean-bubble::before {
  animation: rlBubbleSwirl var(--bubble-swirl-duration) ease-in-out var(--bubble-delay) infinite;
  background: radial-gradient(
    circle at 30% 30%,
    rgba(242, 253, 255, 0.58) 0%,
    rgba(189, 233, 247, 0.24) 38%,
    rgba(129, 200, 225, 0.08) 74%,
    rgba(99, 171, 198, 0.01) 100%
  );
  border: 1px solid rgba(190, 232, 246, 0.24);
  border-radius: 50%;
  box-shadow:
    0 0 10px rgba(143, 214, 234, 0.12),
    inset 0 0 6px rgba(237, 250, 255, 0.2);
  content: "";
  display: block;
  height: 100%;
  width: 100%;
}

.ocean-bubble.is-short {
  animation-name: rlBubbleRiseShort;
}

.page {
  /* Keep layout in normal flow while preserving logo layering. */
  position: relative;
}

.rl-page-nav,
.rl-home .rl-shell,
.footer-inner {
  position: relative;
  z-index: 3;
}

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

.skip-link {
  background: #e6f8ff;
  border: 1px solid #66a9c0;
  border-radius: 0.45rem;
  color: #0d4d66;
  font-size: 0.74rem;
  font-weight: 700;
  left: 0.75rem;
  letter-spacing: 0.04em;
  padding: 0.55rem 0.72rem;
  position: fixed;
  text-decoration: none;
  top: 0.7rem;
  transform: translateY(-160%);
  transition: transform 0.2s ease;
  z-index: 160;
}

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

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

.site-header {
  backdrop-filter: blur(9px);
  background: rgba(3, 24, 38, 0.78);
  border-bottom: 1px solid var(--line);
  left: 0;
  position: sticky;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 100;
}

.header-inner {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 84rem;
  padding: 0.75rem 1rem;
}

.brand {
  align-items: center;
  display: inline-flex;
  gap: 0.6rem;
  text-decoration: none;
}

.brand img {
  border-radius: 0.4rem;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
  height: 2rem;
  width: 2rem;
}

.brand-text {
  display: block;
}

.brand-name {
  color: #f4fcff;
  display: block;
  font-family: var(--heading-font);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1;
}

.brand-sub {
  color: var(--muted);
  display: block;
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  margin-top: 0.12rem;
  text-transform: uppercase;
}

.menu-toggle {
  background: transparent;
  border: 1px solid rgba(175, 225, 239, 0.46);
  border-radius: 0.45rem;
  color: #d8f2fb;
  cursor: pointer;
  display: none;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 0.45rem 0.62rem;
  text-transform: uppercase;
}

.main-nav {
  align-items: center;
  display: flex;
  gap: 0.4rem;
}

.main-nav a {
  border-radius: 999px;
  color: #e6f6fd;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 0.48rem 0.72rem;
  text-decoration: none;
  text-transform: uppercase;
  transition: background 0.2s ease, color 0.2s ease;
}

.main-nav a:hover {
  background: rgba(94, 180, 204, 0.2);
  color: #ffffff;
}

.main-nav a.is-active {
  background: rgba(43, 167, 191, 0.3);
  color: #ffffff;
}

a:focus-visible,
button:focus-visible {
  outline: 3px solid #a8efff;
  outline-offset: 3px;
}

.main-nav a:focus-visible,
.rl-page-nav a:focus-visible,
.rl-page-nav-toggle:focus-visible,
.footer-links a:focus-visible,
.rl-home .rl-btn:focus-visible,
.menu-toggle:focus-visible {
  border-radius: 0.55rem;
  box-shadow: 0 0 0 3px rgba(3, 41, 56, 0.45);
}

.rl-home p a,
.rl-home li a {
  color: #0a5e79;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 0.09em;
  text-underline-offset: 0.16em;
}

.rl-home p a:hover,
.rl-home li a:hover {
  color: #063e51;
}

.rl-home .rl-tone-dark p a,
.rl-home .rl-tone-dark li a {
  color: #bdefff;
}

.rl-home .rl-tone-dark p a:hover,
.rl-home .rl-tone-dark li a:hover {
  color: #ffffff;
}

.page {
  margin: 0;
  min-height: calc(100vh - 8.5rem);
  padding-bottom: calc(var(--footer-runtime-height, var(--footer-height)) + env(safe-area-inset-bottom, 0px));
}

.rl-home {
  --rl-ink: #093349;
  --rl-subtle: #3a6475;
  color: var(--rl-ink);
  margin-top: 0;
}

.rl-home h1,
.rl-home h2,
.rl-home h3 {
  font-family: var(--heading-font);
  letter-spacing: 0.01em;
  margin: 0;
}

.rl-home p {
  margin: 0;
}

.rl-home figure {
  margin: 0;
}

.rl-home .rl-section {
  align-items: center;
  background-attachment: fixed;
  display: flex;
  min-height: min(88vh, 60rem);
  overflow: hidden;
  padding: clamp(3.2rem, 5.5vw, 5.4rem) clamp(1.1rem, 5.5vw, 4.8rem);
  position: relative;
  scroll-margin-top: 5.2rem;
}

.rl-home .rl-section::after {
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.02) 12%, transparent 24%),
    linear-gradient(115deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 48%, rgba(0, 0, 0, 0.06) 100%),
    linear-gradient(0deg, rgba(0, 0, 0, 0.12) 0%, transparent 20%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.rl-home .rl-banner-parallax {
  background:
    radial-gradient(900px 320px at 8% 10%, rgba(255, 255, 255, 0.46), transparent 72%),
    radial-gradient(880px 300px at 92% 88%, rgba(226, 244, 248, 0.38), transparent 70%),
    linear-gradient(165deg, #f1f8fb 0%, #d9edf2 52%, #c7e2ea 100%);
  min-height: clamp(11.5rem, 26vh, 15rem);
  padding: clamp(0.85rem, 2vw, 1.2rem) clamp(1rem, 5vw, 3rem);
}

.rl-home .rl-banner-parallax::after {
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0.08) 32%, transparent 58%),
    linear-gradient(0deg, rgba(16, 67, 86, 0.14) 0%, transparent 36%);
}

.rl-home .rl-banner-parallax .rl-shell {
  z-index: 2;
}

.rl-home .rl-banner-shell {
  max-width: 72rem;
  min-height: 1px;
}

.rl-home .rl-banner-parallax-art {
  --rl-parallax-shift: 0px;
  --rl-parallax-scale: 1.05;
  filter: drop-shadow(0 10px 20px rgba(20, 72, 90, 0.22));
  left: 54%;
  max-width: min(74rem, 94vw);
  pointer-events: none;
  position: absolute;
  top: 52%;
  transform: translate(-50%, calc(-50% + var(--rl-parallax-shift))) scale(var(--rl-parallax-scale));
  transform-origin: 50% 50%;
  width: min(88vw, 66rem);
  will-change: transform;
  z-index: 1;
}

.rl-home .rl-shell {
  margin: 0 auto;
  max-width: 72rem;
  position: relative;
  width: 100%;
  z-index: 1;
}

.rl-home .rl-cta-shell {
  max-width: 46rem;
  text-align: center;
}

.rl-home .rl-eyebrow {
  backdrop-filter: blur(2px);
  background: rgba(6, 90, 122, 0.11);
  border: 1px solid rgba(17, 115, 150, 0.24);
  border-radius: 999px;
  color: #0d5e7e;
  display: inline-flex;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  margin-bottom: 0.8rem;
  padding: 0.34rem 0.7rem;
  text-transform: uppercase;
}

.rl-home h1 {
  font-size: clamp(2.2rem, 5vw, 4.2rem);
  line-height: 1.06;
  margin-bottom: 0.9rem;
}

.rl-home h2 {
  font-size: clamp(1.6rem, 3.5vw, 2.8rem);
  line-height: 1.14;
  margin-bottom: 0.9rem;
}

.rl-home h3 {
  font-size: 1.03rem;
  line-height: 1.25;
  margin-bottom: 0.42rem;
}

.rl-home .rl-lead,
.rl-home .rl-intro {
  color: var(--rl-subtle);
  font-size: clamp(1rem, 1.9vw, 1.2rem);
  line-height: 1.68;
  max-width: 100%;
  width: 100%;
}

.rl-home #home .rl-home-vision {
  color: rgba(234, 249, 255, 0.98);
  font-weight: 600;
  margin-bottom: clamp(0.7rem, 1.6vw, 1rem);
}

.rl-home #about-home .rl-intro + .rl-lead {
  margin-top: clamp(0.8rem, 1.8vw, 1.2rem);
}

@media screen and (min-width: 76.25em) {
  .rl-home.rl-home-compact #home {
    min-height: min(86vh, 56rem);
  }

  .rl-home.rl-home-compact .rl-section:not(#home) {
    background-attachment: scroll;
    min-height: clamp(30rem, 72vh, 44rem);
    padding: clamp(2.4rem, 4vw, 3.8rem) clamp(1.1rem, 4.8vw, 4.2rem);
  }
}

@media screen and (min-width: 76.25em) {
  .rl-home .rl-lead,
  .rl-home .rl-intro {
    text-align: justify;
    text-align-last: left;
  }
}

.rl-home .rl-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.72rem;
  margin-top: 1.4rem;
}

.rl-home .rl-btn {
  border: 1px solid transparent;
  border-radius: 999px;
  display: inline-flex;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1;
  padding: 0.72rem 1.1rem;
  text-decoration: none;
  text-transform: uppercase;
  transition: all 0.24s ease;
}

.rl-home .rl-btn-primary {
  background: #1e8ea0;
  border-color: rgba(255, 255, 255, 0.22);
  color: #f5ffff;
}

.rl-home .rl-btn-primary:hover {
  background: #26a3b6;
  box-shadow: 0 9px 20px rgba(10, 48, 63, 0.32);
}

.rl-home .rl-btn-ghost {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.45);
  color: #f3fbff;
}

.rl-home .rl-btn-ghost:hover {
  background: rgba(255, 255, 255, 0.12);
}

.rl-page-nav {
  backdrop-filter: blur(8px);
  background: rgba(3, 28, 43, 0.8);
  border: 1px solid rgba(173, 225, 238, 0.25);
  border-radius: 0.85rem;
  box-shadow: 0 12px 24px rgba(2, 20, 31, 0.24);
  display: flex;
  flex-direction: column;
  gap: 0.22rem;
  padding: 0.62rem 0.52rem;
  position: fixed;
  right: clamp(0.5rem, 1.2vw, 1rem);
  top: 50%;
  transform: translateY(-50%);
  width: 9.75rem;
  z-index: 96;
  max-height: calc(100vh - 6rem - var(--footer-runtime-height, var(--footer-height)));
  overflow-y: auto;
  overscroll-behavior: contain;
}

.rl-page-nav-toggle {
  align-items: center;
  background: rgba(10, 62, 82, 0.94);
  border: 1px solid rgba(173, 225, 238, 0.4);
  border-radius: 999px;
  color: #e7f7fc;
  cursor: pointer;
  display: none;
  font-size: 0.65rem;
  font-weight: 700;
  justify-content: center;
  letter-spacing: 0.06em;
  line-height: 1;
  padding: 0.52rem 0.8rem;
  text-transform: uppercase;
  white-space: nowrap;
}

.rl-page-nav-toggle:hover {
  background: rgba(27, 121, 150, 0.9);
  color: #ffffff;
}

.rl-page-nav.is-compact {
  align-items: flex-end;
  background: rgba(3, 28, 43, 0.86);
  bottom: calc(var(--footer-runtime-height, var(--footer-height)) + 0.75rem);
  max-height: min(70vh, calc(100vh - var(--footer-runtime-height, var(--footer-height)) - 5.25rem));
  min-width: 0;
  padding: 0.44rem;
  right: max(0.65rem, env(safe-area-inset-right));
  top: auto;
  transform: none;
  width: auto;
}

.rl-page-nav.is-compact .rl-page-nav-toggle {
  display: inline-flex;
}

.rl-page-nav.is-compact .rl-page-nav-title,
.rl-page-nav.is-compact a {
  display: none;
}

.rl-page-nav.is-compact.is-expanded {
  align-items: stretch;
  min-width: min(12.5rem, calc(100vw - 1.4rem));
  padding: 0.62rem 0.52rem;
}

.rl-page-nav.is-compact.is-expanded .rl-page-nav-toggle {
  margin-bottom: 0.22rem;
  width: 100%;
}

.rl-page-nav.is-compact.is-expanded .rl-page-nav-title,
.rl-page-nav.is-compact.is-expanded a {
  display: block;
}

.rl-page-nav.is-delayed {
  transition: opacity 0.26s ease, transform 0.26s ease;
}

.rl-page-nav.is-delayed.is-hidden {
  opacity: 0;
  pointer-events: none;
  transform: translate(14px, -50%);
}

.rl-page-nav.is-compact.is-delayed.is-hidden {
  transform: translate(10px, 0);
}

.rl-page-nav-title {
  color: #c7eaf5;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin: 0 0 0.24rem;
  padding: 0 0.3rem;
  text-transform: uppercase;
}

.rl-page-nav a {
  border-radius: 0.45rem;
  color: #dbf0f7;
  display: block;
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.22;
  padding: 0.44rem 0.46rem 0.46rem;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.rl-page-nav a:hover {
  background: rgba(132, 202, 220, 0.22);
  color: #ffffff;
  transform: translateX(-1px);
}

.rl-page-nav a.is-active {
  background: rgba(51, 170, 191, 0.34);
  color: #ffffff;
}

.rl-home .rl-stats {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 1.9rem;
}

.rl-home .rl-stat {
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(181, 231, 242, 0.32);
  border-radius: 0.85rem;
  box-shadow: var(--card-shadow);
  padding: 1rem 0.95rem 1.05rem;
}

.rl-home .rl-stat h3 {
  color: #f4fdff;
}

.rl-home .rl-stat p {
  color: rgba(234, 247, 251, 0.96);
  font-size: 0.84rem;
  line-height: 1.62;
}

.rl-home .rl-source {
  margin-top: 0.62rem;
}

.rl-home .rl-source a {
  color: #a4e8f8;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-decoration: none;
  text-transform: uppercase;
}

.rl-home .rl-source a:hover {
  text-decoration: underline;
}

.rl-home .rl-timeline {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 1.8rem;
}

.rl-home .rl-step {
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(148, 190, 200, 0.44);
  border-radius: 0.8rem;
  box-shadow: 0 8px 20px rgba(12, 43, 57, 0.08);
  min-height: 12.5rem;
  padding: 1rem 0.95rem 1.05rem;
  position: relative;
}

.rl-home .rl-step-number {
  align-items: center;
  background: #1a7f90;
  border-radius: 999px;
  color: #f5ffff;
  display: inline-flex;
  font-size: 0.64rem;
  font-weight: 700;
  height: 1.4rem;
  justify-content: center;
  letter-spacing: 0.07em;
  line-height: 1;
  margin-bottom: 0.68rem;
  width: 2.05rem;
}

.rl-home .rl-step h3 {
  color: #11465c;
}

.rl-home .rl-step p {
  color: #395c68;
  font-size: 0.84rem;
  line-height: 1.6;
}

.rl-home .rl-flow-loop {
  margin: 1.25rem auto 1.45rem;
  max-width: 34rem;
  position: relative;
  width: 100%;
}

.rl-home .rl-flow-track {
  aspect-ratio: 1 / 1;
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}

.rl-home .rl-flow-track::before {
  border: 2px dashed rgba(64, 112, 132, 0.56);
  border-radius: 50%;
  content: "";
  inset: 18%;
  position: absolute;
}

.rl-home .rl-flow-node {
  --flow-accent: #1f7f91;
  align-items: center;
  background: linear-gradient(160deg, #f1f9fc 0%, #e3f2f7 100%);
  border: 1px solid color-mix(in srgb, var(--flow-accent) 36%, #ffffff);
  border-radius: 0.88rem;
  box-shadow: 0 10px 22px rgba(10, 38, 52, 0.08);
  display: flex;
  justify-content: center;
  left: 50%;
  min-height: 18%;
  padding: 0.62rem 0.48rem;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 22%;
}

.rl-home .rl-flow-name {
  color: #194d61;
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.2;
  text-align: center;
}

.rl-home .rl-flow-core {
  align-items: center;
  background: linear-gradient(170deg, #fdfefe 0%, #e7f4f8 100%);
  border: 1px solid rgba(84, 132, 152, 0.36);
  border-radius: 50%;
  box-shadow: 0 8px 18px rgba(12, 41, 56, 0.1);
  display: flex;
  inset: 35%;
  justify-content: center;
  pointer-events: none;
  position: absolute;
  text-align: center;
}

.rl-home .rl-flow-core span {
  color: #2f6073;
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.35;
  text-transform: uppercase;
}

.rl-home .rl-flow-donor {
  --flow-accent: #1e7f9b;
  background: linear-gradient(160deg, #e7f6fb 0%, #d9edf5 100%);
  left: 50%;
  top: 12%;
}

.rl-home .rl-flow-nursery {
  --flow-accent: #2e8b72;
  background: linear-gradient(160deg, #e8f8f2 0%, #d9efea 100%);
  left: 86%;
  top: 38%;
}

.rl-home .rl-flow-outplant {
  --flow-accent: #a56a2f;
  background: linear-gradient(160deg, #fdf4e8 0%, #f6e8d8 100%);
  left: 72%;
  top: 81%;
}

.rl-home .rl-flow-relocate {
  --flow-accent: #97506b;
  background: linear-gradient(160deg, #f9edf2 0%, #f1e1e9 100%);
  left: 28%;
  top: 81%;
}

.rl-home .rl-flow-reuse {
  --flow-accent: #3f6f9d;
  background: linear-gradient(160deg, #edf2fb 0%, #e0e9f7 100%);
  left: 14%;
  top: 38%;
}

.rl-home .rl-bg-lagoon .rl-source a,
.rl-home .rl-bg-sunrise .rl-source a {
  color: #0f677f;
}

.rl-home .rl-card-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 1.7rem;
}

.rl-home .rl-card {
  background: rgba(4, 48, 71, 0.46);
  border: 1px solid rgba(174, 224, 236, 0.35);
  border-radius: 0.82rem;
  box-shadow: var(--card-shadow);
  min-height: 10.7rem;
  padding: 1rem 0.95rem 1.05rem;
}

.rl-home .rl-card h3 {
  color: #f4fdff;
}

.rl-home .rl-card p {
  color: rgba(223, 244, 250, 0.94);
  font-size: 0.84rem;
  line-height: 1.62;
}

.rl-home .rl-bg-lagoon .rl-card,
.rl-home .rl-bg-sunrise .rl-card {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(138, 184, 197, 0.45);
  box-shadow: 0 8px 20px rgba(9, 34, 45, 0.08);
}

.rl-home .rl-bg-lagoon .rl-card h3,
.rl-home .rl-bg-sunrise .rl-card h3 {
  color: #11465d;
}

.rl-home .rl-bg-lagoon .rl-card p,
.rl-home .rl-bg-sunrise .rl-card p {
  color: #3b606c;
}

.rl-home #operations .rl-role-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  padding-inline: clamp(0.6rem, 2.6vw, 2rem);
}

.rl-home #operations .rl-role-grid .rl-card {
  flex: 0 1 calc((100% - 2rem) / 3);
}

.rl-home #operations .rl-role-break {
  flex-basis: 100%;
  height: 0;
}

.rl-home .rl-link-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 1.6rem;
}

.rl-home .rl-link-card {
  background: rgba(6, 56, 82, 0.48);
  border: 1px solid rgba(171, 224, 236, 0.36);
  border-radius: 0.82rem;
  box-shadow: var(--card-shadow);
  color: #f3fbff;
  display: block;
  min-height: 9.8rem;
  padding: 0.95rem 0.9rem 1rem;
  text-decoration: none;
  transition: all 0.24s ease;
}

.rl-home .rl-link-card h3 {
  color: #f4fcff;
  font-size: 0.95rem;
  margin-bottom: 0.44rem;
}

.rl-home .rl-link-card p {
  color: rgba(217, 242, 250, 0.95);
  font-size: 0.82rem;
  line-height: 1.58;
}

.rl-home .rl-link-card:hover {
  background: rgba(17, 79, 108, 0.56);
  border-color: rgba(194, 237, 247, 0.56);
  box-shadow: 0 12px 26px rgba(7, 29, 41, 0.24);
  transform: translateY(-4px);
}

.rl-home .rl-split {
  align-items: start;
  display: grid;
  gap: 1.2rem;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
}

.rl-home .rl-about-intro {
  align-items: center;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
}

.rl-home .rl-longform {
  display: grid;
  gap: 0.9rem;
}

.rl-home .rl-longform .rl-eyebrow {
  justify-self: start;
  width: fit-content;
}

.rl-home .rl-logo-inline {
  margin: 1rem auto 0;
  text-align: center;
}

.rl-home .rl-logo-inline img {
  filter: drop-shadow(0 8px 16px rgba(3, 34, 48, 0.2));
  margin: 0 auto;
  max-width: min(15.5rem, 56%);
}

.rl-home .rl-logo-panel {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(132, 181, 195, 0.46);
  border-radius: 0.9rem;
  box-shadow: 0 10px 24px rgba(9, 34, 45, 0.1);
  display: grid;
  gap: 0.9rem;
  justify-items: center;
  padding: 1.1rem 1rem 1rem;
  text-align: center;
}

.rl-home .rl-logo-panel img {
  filter: drop-shadow(0 8px 16px rgba(3, 34, 48, 0.2));
  max-width: min(13rem, 72%);
}

.rl-home .rl-pill-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.rl-home .rl-pill-list li {
  background: linear-gradient(160deg, #e9f6fa 0%, #def0f6 100%);
  border: 1px solid rgba(109, 158, 175, 0.44);
  border-radius: 999px;
  color: #14556d;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.2;
  padding: 0.42rem 0.7rem;
  text-transform: uppercase;
}

.rl-home .rl-pill-list-right {
  justify-content: flex-end;
  margin-left: auto;
}

.rl-home .rl-pill-list-foundation li:nth-child(1) {
  background: linear-gradient(160deg, #e4f5ff 0%, #d7ecfb 100%);
  border-color: rgba(78, 137, 171, 0.48);
  color: #124f69;
}

.rl-home .rl-pill-list-foundation li:nth-child(2) {
  background: linear-gradient(160deg, #e8f7f0 0%, #dff1e8 100%);
  border-color: rgba(84, 142, 120, 0.48);
  color: #1c5d47;
}

.rl-home .rl-pill-list-foundation li:nth-child(3) {
  background: linear-gradient(160deg, #fff2df 0%, #f8e8d2 100%);
  border-color: rgba(171, 126, 71, 0.5);
  color: #6a4015;
}

.rl-home #who .rl-split {
  align-items: center;
}

.rl-home #who .rl-audience-grid {
  align-self: center;
}

.rl-home #concept .rl-split {
  align-items: center;
}

.rl-home #concept .rl-audience-grid {
  align-self: center;
}

.rl-home #local-first .rl-split {
  align-items: center;
}

.rl-home #local-first .rl-audience-grid {
  align-self: center;
}

.rl-home #local-first .rl-btn-ghost {
  background: rgba(255, 255, 255, 0.52);
  border-color: rgba(20, 98, 124, 0.42);
  color: #0d5f7f;
}

.rl-home #local-first .rl-btn-ghost:hover {
  background: rgba(210, 236, 244, 0.78);
  border-color: rgba(20, 98, 124, 0.56);
  color: #0a4c67;
}

.rl-home #about-faq .rl-btn-ghost {
  background: rgba(255, 255, 255, 0.52);
  border-color: rgba(20, 98, 124, 0.42);
  color: #0d5f7f;
}

.rl-home #about-faq .rl-btn-ghost:hover {
  background: rgba(210, 236, 244, 0.78);
  border-color: rgba(20, 98, 124, 0.56);
  color: #0a4c67;
}

.rl-home #mailing-lists .rl-btn-ghost {
  background: rgba(255, 255, 255, 0.58);
  border-color: rgba(20, 98, 124, 0.42);
  color: #0d5f7f;
}

.rl-home #mailing-lists .rl-btn-ghost:hover {
  background: rgba(210, 236, 244, 0.82);
  border-color: rgba(20, 98, 124, 0.56);
  color: #0a4c67;
}

.rl-home #developer-access .rl-btn-ghost {
  background: rgba(255, 255, 255, 0.58);
  border-color: rgba(20, 98, 124, 0.42);
  color: #0d5f7f;
}

.rl-home #developer-access .rl-btn-ghost:hover {
  background: rgba(210, 236, 244, 0.82);
  border-color: rgba(20, 98, 124, 0.56);
  color: #0a4c67;
}

.rl-home #deepdive-faq .rl-btn-ghost {
  background: rgba(255, 255, 255, 0.58);
  border-color: rgba(20, 98, 124, 0.42);
  color: #0d5f7f;
}

.rl-home #deepdive-faq .rl-btn-ghost:hover {
  background: rgba(210, 236, 244, 0.82);
  border-color: rgba(20, 98, 124, 0.56);
  color: #0a4c67;
}

.rl-home .rl-note-card {
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(184, 232, 244, 0.36);
  border-left: 0.38rem solid #7dd8ed;
  border-radius: 0.86rem;
  margin-top: 1.1rem;
  padding: 1rem 0.98rem 1.02rem;
}

.rl-home .rl-note-card h3 {
  color: #f5fdff;
  margin-bottom: 0.5rem;
}

.rl-home .rl-note-card p {
  color: rgba(229, 247, 251, 0.96);
  font-size: 0.86rem;
  line-height: 1.62;
}

.rl-home .rl-bg-lagoon .rl-note-card,
.rl-home .rl-bg-sunrise .rl-note-card {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(138, 184, 197, 0.45);
  border-left: 0.38rem solid #1f7f91;
  box-shadow: 0 8px 20px rgba(9, 34, 45, 0.08);
}

.rl-home .rl-bg-lagoon .rl-note-card h3,
.rl-home .rl-bg-sunrise .rl-note-card h3 {
  color: #1a4f62;
}

.rl-home .rl-bg-lagoon .rl-note-card p,
.rl-home .rl-bg-sunrise .rl-note-card p {
  color: #3b606c;
}

.rl-home .rl-purpose-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.rl-home #support-faq .rl-card-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rl-home .rl-command-grid .rl-delivery-tip {
  grid-column: 2;
}

.rl-home .rl-object-flow {
  display: grid;
  gap: 0.55rem;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  list-style: none;
  margin: 0.95rem 0 0;
  padding: 0;
}

.rl-home .rl-object-pill {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 0.75rem;
  box-shadow: 0 7px 16px rgba(9, 36, 50, 0.1);
  color: #18495e;
  display: inline-flex;
  font-size: 0.66rem;
  font-weight: 700;
  justify-content: center;
  letter-spacing: 0.04em;
  min-height: 2.15rem;
  padding: 0.42rem 0.35rem;
  position: relative;
  text-transform: uppercase;
}

.rl-home .rl-object-site {
  background: linear-gradient(160deg, #e6f5ff 0%, #d6ecf8 100%);
  border-color: #96c7df;
  color: #11506a;
}

.rl-home .rl-object-zone {
  background: linear-gradient(160deg, #e9f9f2 0%, #dbf1e7 100%);
  border-color: #9dcfb9;
  color: #1a5a45;
}

.rl-home .rl-object-donor {
  background: linear-gradient(160deg, #fff3e5 0%, #f6e7d4 100%);
  border-color: #d9b78f;
  color: #73471f;
}

.rl-home .rl-object-planting {
  background: linear-gradient(160deg, #e9f5ea 0%, #ddeeec 100%);
  border-color: #a7c8b0;
  color: #265843;
}

.rl-home .rl-object-observation {
  background: linear-gradient(160deg, #e8f0fb 0%, #dce9f7 100%);
  border-color: #9eb7d6;
  color: #245079;
}

.rl-home .rl-audience-grid {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: 1fr;
}

.rl-home .rl-audience-card {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(138, 184, 197, 0.45);
  border-left: 0.35rem solid #1f7f91;
  border-radius: 0.82rem;
  box-shadow: 0 8px 20px rgba(9, 34, 45, 0.08);
  padding: 0.95rem 0.95rem 1rem;
}

.rl-home .rl-audience-card h3 {
  color: #1a4f62;
}

.rl-home .rl-audience-card p {
  color: #3b606c;
  font-size: 0.84rem;
  line-height: 1.6;
}

.rl-home .rl-tone-dark,
.rl-home .rl-tone-dark h1,
.rl-home .rl-tone-dark h2,
.rl-home .rl-tone-dark h3 {
  color: #f3fbff;
}

.rl-home .rl-tone-dark .rl-eyebrow {
  background: rgba(173, 225, 238, 0.18);
  border-color: rgba(177, 231, 244, 0.34);
  color: #d9f4fb;
}

.rl-home .rl-tone-dark .rl-lead,
.rl-home .rl-tone-dark .rl-intro {
  color: rgba(221, 244, 250, 0.96);
}

.rl-home .rl-bg-reef {
  --rl-section-bg:
    radial-gradient(1100px 420px at -6% 16%, rgba(102, 225, 236, 0.26), transparent 72%),
    radial-gradient(840px 440px at 103% 95%, rgba(116, 177, 235, 0.24), transparent 70%),
    linear-gradient(132deg, #032e45 0%, #055168 46%, #0e6e7d 100%);
  background-image: var(--rl-section-bg);
}

.rl-home .rl-bg-lagoon {
  --rl-section-bg:
    radial-gradient(920px 380px at 8% -8%, rgba(255, 255, 255, 0.7), transparent 70%),
    radial-gradient(780px 360px at 96% 104%, rgba(173, 232, 224, 0.56), transparent 68%),
    linear-gradient(180deg, #f5fcff 0%, #e6f5f8 47%, #d4ebe7 100%);
  background-image: var(--rl-section-bg);
}

.rl-home .rl-bg-current {
  --rl-section-bg:
    radial-gradient(1000px 380px at -10% 20%, rgba(93, 221, 217, 0.18), transparent 68%),
    radial-gradient(780px 360px at 98% 85%, rgba(89, 174, 226, 0.21), transparent 69%),
    linear-gradient(145deg, #05344c 0%, #0a4f63 49%, #0f6675 100%);
  background-image: var(--rl-section-bg);
}

.rl-home .rl-bg-sunrise {
  --rl-section-bg:
    radial-gradient(840px 380px at -8% 12%, rgba(255, 255, 255, 0.62), transparent 70%),
    radial-gradient(840px 380px at 104% 92%, rgba(238, 203, 157, 0.4), transparent 72%),
    linear-gradient(176deg, #fcf8f0 0%, #f4efe0 54%, #edf0e8 100%);
  background-image: var(--rl-section-bg);
}

.site-footer {
  background: rgba(1, 12, 22, 0.85);
  backdrop-filter: blur(8px);
  border-top: 1px solid var(--line);
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  width: 100%;
  z-index: 95;
}

body.motion-calm .ocean-bubbles {
  display: block !important;
}

body.motion-calm .floating-bg-logo {
  animation: none !important;
  opacity: 0.09;
  transition: opacity 0.24s ease;
}

@keyframes rlBubbleRise {
  0% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }

  10% {
    opacity: var(--bubble-opacity);
  }

  36% {
    transform: translate3d(calc(var(--bubble-drift) * 0.18), calc(var(--bubble-rise) * -0.36), 0);
  }

  60% {
    transform: translate3d(calc(var(--bubble-drift) * -0.2), calc(var(--bubble-rise) * -0.66), 0);
  }

  80% {
    opacity: calc(var(--bubble-opacity) * 0.62);
  }

  100% {
    opacity: 0;
    transform: translate3d(var(--bubble-drift), calc(var(--bubble-rise) * -1), 0);
  }
}

@keyframes rlBubbleRiseShort {
  0% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }

  10% {
    opacity: var(--bubble-opacity);
  }

  42% {
    opacity: calc(var(--bubble-opacity) * 0.7);
    transform: translate3d(calc(var(--bubble-drift) * 0.08), calc(var(--bubble-rise) * -0.4), 0);
  }

  66% {
    opacity: 0;
    transform: translate3d(calc(var(--bubble-drift) * -0.18), calc(var(--bubble-rise) * -0.68), 0);
  }

  100% {
    opacity: 0;
    transform: translate3d(calc(var(--bubble-drift) * -0.22), calc(var(--bubble-rise) * -0.74), 0);
  }
}

@keyframes rlBubbleSwirl {
  0% {
    transform: translateX(0) scale(0.9) rotate(0deg);
  }

  25% {
    transform: translateX(var(--bubble-sway)) scale(1) rotate(var(--bubble-twist));
  }

  50% {
    transform: translateX(calc(var(--bubble-sway) * -0.72)) scale(1.04) rotate(calc(var(--bubble-twist) * -0.55));
  }

  75% {
    transform: translateX(calc(var(--bubble-sway) * 0.46)) scale(1) rotate(calc(var(--bubble-twist) * 0.4));
  }

  100% {
    transform: translateX(0) scale(0.95) rotate(0deg);
  }
}

.footer-inner {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin: 0 auto;
  max-width: 84rem;
  flex-wrap: wrap;
  padding: 0.95rem 1rem;
}

.footer-copy {
  color: rgba(207, 231, 242, 0.72);
  font-size: 0.74rem;
  letter-spacing: 0.035em;
  line-height: 1;
}

.footer-links {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
}

.footer-links a {
  color: rgba(213, 236, 245, 0.84);
  font-size: 0.72rem;
  letter-spacing: 0.03em;
  position: relative;
  text-decoration: none;
}

.footer-links a:first-child {
  padding-left: 0.95rem;
}

.footer-links a:first-child::before {
  color: rgba(213, 236, 245, 0.5);
  content: "|";
  left: 0;
  pointer-events: none;
  position: absolute;
}

.footer-links a + a {
  padding-left: 0.95rem;
}

.footer-links a + a::before {
  color: rgba(213, 236, 245, 0.5);
  content: "|";
  left: 0;
  pointer-events: none;
  position: absolute;
}

.footer-links a:hover {
  color: #ffffff;
  text-decoration: underline;
}

@media screen and (max-width: 34rem) {
  .footer-links {
    gap: 0.6rem 0.9rem;
    justify-content: center;
  }

  .footer-links a + a {
    padding-left: 0;
  }

  .footer-links a:first-child {
    padding-left: 0;
  }

  .footer-links a + a::before {
    content: none;
  }

  .footer-links a:first-child::before {
    content: none;
  }
}

@media screen and (max-width: 48rem) {
  .page {
    padding-bottom: calc(var(--footer-runtime-height, var(--footer-height-mobile)) + env(safe-area-inset-bottom, 0px));
  }
}

.rl-home .rl-stat,
.rl-home .rl-step,
.rl-home .rl-card,
.rl-home .rl-audience-card,
.rl-home .rl-link-card {
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.rl-home .rl-stat:hover,
.rl-home .rl-step:hover,
.rl-home .rl-card:hover,
.rl-home .rl-audience-card:hover,
.rl-home .rl-link-card:hover {
  box-shadow: 0 12px 26px rgba(7, 29, 41, 0.2);
  transform: translateY(-4px);
}

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

  .floating-bg-logo,
  .ocean-bubble {
    animation: none !important;
  }

  .ocean-bubble::before {
    animation: none !important;
  }

  .ocean-bubbles {
    display: none !important;
  }
}

@media screen and (min-width: 76.25em) and (max-height: 54em) {
  .rl-page-nav {
    bottom: calc(var(--footer-runtime-height, var(--footer-height)) + 0.75rem);
    top: auto;
    transform: none;
  }

  .rl-page-nav.is-delayed.is-hidden {
    transform: translate(10px, 0);
  }
}

@media screen and (max-width: 76.234375em) {
  .floating-bg-logo {
    opacity: 0.09;
  }

  .rl-page-nav {
    display: none;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .main-nav {
    background: rgba(3, 24, 38, 0.98);
    border: 1px solid rgba(181, 231, 242, 0.2);
    border-radius: 0.75rem;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.28);
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.45rem;
    position: absolute;
    right: 1rem;
    top: 4.1rem;
    width: min(20rem, calc(100vw - 2rem));
    z-index: 120;
  }

  body.nav-closed .main-nav {
    display: none;
  }

  body.nav-open .main-nav {
    display: flex;
  }

  .main-nav a {
    border-radius: 0.5rem;
    display: block;
    font-size: 0.72rem;
    padding: 0.65rem 0.7rem;
    width: 100%;
  }

  .rl-home .rl-section {
    background-attachment: scroll;
    min-height: auto;
    padding: 2.9rem 1rem 3.1rem;
  }

  .rl-home .rl-banner-parallax {
    min-height: clamp(9.8rem, 20vh, 12rem);
    padding: clamp(0.45rem, 2.6vw, 0.9rem) 1rem;
  }

  .rl-home .rl-banner-parallax-art {
    --rl-parallax-scale: 1;
    left: 50%;
    top: 56%;
    width: min(96vw, 44rem);
  }

  .rl-home .rl-stats,
  .rl-home .rl-timeline,
  .rl-home .rl-card-grid,
  .rl-home .rl-link-grid {
    grid-template-columns: 1fr;
  }

  .rl-home #support-faq .rl-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rl-home .rl-command-grid .rl-delivery-tip {
    grid-column: auto;
  }

  .rl-home #operations .rl-role-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
    padding-inline: 0;
  }

  .rl-home #operations .rl-role-grid .rl-card {
    flex: initial;
  }

  .rl-home #operations .rl-role-break {
    display: none;
  }

  .rl-home .rl-flow-loop {
    margin: 1rem auto 1.2rem;
    max-width: min(22rem, 94vw);
  }

  .rl-home .rl-flow-node {
    min-height: 19%;
    padding: 0.5rem 0.35rem;
    width: 24%;
  }

  .rl-home .rl-flow-track::before {
    inset: 19%;
  }

  .rl-home .rl-flow-name {
    font-size: 0.74rem;
  }

  .rl-home .rl-flow-core {
    inset: 34%;
  }

  .rl-home .rl-flow-core span {
    font-size: 0.57rem;
    letter-spacing: 0.05em;
  }

  .rl-home .rl-step,
  .rl-home .rl-card,
  .rl-home .rl-link-card {
    min-height: auto;
  }

  .rl-home .rl-split {
    grid-template-columns: 1fr;
  }

  .rl-home .rl-object-flow {
    gap: 0.45rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rl-home .rl-object-pill {
    min-height: 2rem;
  }

  .footer-inner {
    justify-content: center;
  }
}

@media screen and (max-width: 48rem) {
  .rl-home #support-faq .rl-card-grid {
    grid-template-columns: 1fr;
  }
}

@media screen and (max-width: 30em) {
  .floating-bg-logo {
    height: clamp(9rem, 44vw, 12.5rem);
    opacity: 0.08;
    width: clamp(9rem, 44vw, 12.5rem);
  }

  .rl-home .rl-flow-loop {
    max-width: min(18.6rem, 95vw);
  }

  .rl-home .rl-flow-node {
    min-height: 20%;
    width: 26%;
  }

  .rl-home .rl-flow-name {
    font-size: 0.66rem;
  }

  .rl-home .rl-flow-core {
    inset: 33%;
  }

  .rl-home .rl-flow-core span {
    font-size: 0.52rem;
  }
}

@media screen and (min-width: 76.25em) {
  body .main-nav {
    display: flex !important;
    position: static;
  }
}