/* ========================================================================
   Rhyfeel — brand layer on top of Bootstrap 5.3
   No build step. Plain CSS. Brand tokens + ~150 lines of overrides.
   ======================================================================== */

/* --- 1. Brand color tokens --------------------------------------------- */
:root {
  --rf-indigo-50:   #f3f3fa;
  --rf-indigo-100:  #e6e5f4;
  --rf-indigo-200:  #c8c6e6;
  --rf-indigo-300:  #a09cd2;
  --rf-indigo-400:  #7773bc;
  --rf-indigo-500:  #524ea2;
  --rf-indigo-600:  #423e8a;
  --rf-indigo-700:  #33316f;
  --rf-indigo-800:  #262554;
  --rf-indigo-900:  #1a1939;
  --rf-indigo-950:  #0e0d20;

  --rf-magenta-50:  #fff0f8;
  --rf-magenta-100: #ffdaee;
  --rf-magenta-200: #ffb1dd;
  --rf-magenta-300: #ff7ec5;
  --rf-magenta-400: #ff44ac;
  --rf-magenta-500: #ec008b;
  --rf-magenta-600: #c4006f;
  --rf-magenta-700: #9a0058;
  --rf-magenta-800: #6f0040;
  --rf-magenta-900: #4d002c;

  --rf-neutral-0:   #ffffff;
  --rf-neutral-50:  #fafafa;
  --rf-neutral-100: #f5f5f5;
  --rf-neutral-200: #e5e5e5;
  --rf-neutral-300: #d4d4d4;
  --rf-neutral-400: #a3a3a3;
  --rf-neutral-500: #737373;
  --rf-neutral-600: #525252;
  --rf-neutral-700: #3f3f46;
  --rf-neutral-800: #27272a;
  --rf-neutral-900: #18181b;

  --rf-shadow-1: 0 1px 2px rgba(26,25,57,0.06);
  --rf-shadow-2: 0 4px 8px rgba(26,25,57,0.08), 0 2px 4px rgba(26,25,57,0.06);
  --rf-shadow-3: 0 12px 24px rgba(26,25,57,0.10), 0 4px 8px rgba(26,25,57,0.06);
  --rf-shadow-4: 0 24px 48px rgba(26,25,57,0.14);
  --rf-shadow-brand: 0 16px 32px rgba(82,78,162,0.25);

  --rf-grad-brand: linear-gradient(135deg, #524ea2 0%, #ec008b 100%);
  --rf-grad-soft:  linear-gradient(180deg, #f3f3fa 0%, #ffffff 100%);
}

/* --- 2. Bootstrap variable bridge -------------------------------------- */
:root,
[data-bs-theme="light"] {
  --bs-primary: var(--rf-indigo-500);
  --bs-primary-rgb: 82, 78, 162;
  --bs-link-color: var(--rf-indigo-700);
  --bs-link-color-rgb: 51, 49, 111;
  --bs-link-hover-color: var(--rf-magenta-500);
  --bs-link-hover-color-rgb: 236, 0, 139;
  --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --bs-body-color: #3f3f46;
  --bs-body-color-rgb: 63, 63, 70;
  --bs-border-color: var(--rf-neutral-200);
  --bs-border-radius: 12px;
  --bs-border-radius-sm: 8px;
  --bs-border-radius-lg: 16px;
  --bs-border-radius-xl: 24px;
  --bs-focus-ring-color: rgba(236, 0, 139, 0.35);
}

/* --- 3. Typography ----------------------------------------------------- */
body {
  font-family: var(--bs-body-font-family);
  color: var(--bs-body-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  letter-spacing: -0.015em;
  color: var(--rf-indigo-900);
  font-weight: 700;
}

.lead { color: var(--rf-neutral-700); font-weight: 400; }

.eyebrow {
  display: inline-block;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 0.1em;
  font-size: 0.8125rem;
  color: var(--rf-indigo-700);
  margin-bottom: .5rem;
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.eyebrow--accent { color: var(--rf-magenta-500); }

.font-mono { font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; }

a { text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* --- 4. Sectioning ----------------------------------------------------- */
.section { padding: 4rem 0; }
@media (min-width: 992px) { .section { padding: 6rem 0; } }
@media (min-width: 1400px) { .section { padding: 7rem 0; } }

.section-alt   { background-color: var(--rf-neutral-50); }
.section-light { background-color: var(--rf-indigo-50); }
.section-dark  { background-color: var(--rf-indigo-900); color: #fafafa; }
.section-dark h1, .section-dark h2, .section-dark h3, .section-dark h4 { color: #ffffff; }
.section-dark .lead { color: rgba(255,255,255,0.85); }
.section-dark .eyebrow { color: var(--rf-magenta-400); }

/* --- 5. Backgrounds & gradients --------------------------------------- */
.bg-rf-gradient { background: var(--rf-grad-brand); color: #fff; }
.bg-rf-gradient h1, .bg-rf-gradient h2, .bg-rf-gradient h3, .bg-rf-gradient h4 { color: #fff; }
.bg-rf-soft { background: var(--rf-grad-soft); }
.bg-indigo-50  { background-color: var(--rf-indigo-50); }
.bg-indigo-900 { background-color: var(--rf-indigo-900); color: #fafafa; }
.bg-magenta-50 { background-color: var(--rf-magenta-50); }

.text-rf-gradient {
  background: var(--rf-grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.text-indigo  { color: var(--rf-indigo-700) !important; }
.text-magenta { color: var(--rf-magenta-500) !important; }
.text-muted-2 { color: var(--rf-neutral-500) !important; }

/* --- 6. Buttons -------------------------------------------------------- */
.btn { font-weight: 600; padding: .65rem 1.4rem; border-radius: 9999px; transition: all .2s ease; }
.btn-lg { padding: .9rem 1.8rem; font-size: 1.0625rem; }

.btn-primary {
  background-color: var(--rf-indigo-500);
  border-color: var(--rf-indigo-500);
  color: #fff;
}
.btn-primary:hover, .btn-primary:focus-visible {
  background-color: var(--rf-indigo-600);
  border-color: var(--rf-indigo-600);
  box-shadow: var(--rf-shadow-brand);
  color: #fff;
}
.btn-primary:active { background-color: var(--rf-indigo-700) !important; border-color: var(--rf-indigo-700) !important; }

.btn-accent {
  background-color: var(--rf-magenta-500);
  border-color: var(--rf-magenta-500);
  color: #fff;
}
.btn-accent:hover, .btn-accent:focus-visible {
  background-color: var(--rf-magenta-600);
  border-color: var(--rf-magenta-600);
  color: #fff;
  box-shadow: 0 16px 32px rgba(236,0,139,0.25);
}

.btn-outline-rf {
  background-color: transparent;
  color: var(--rf-indigo-700);
  border: 1px solid var(--rf-indigo-300);
}
.btn-outline-rf:hover { background-color: var(--rf-indigo-50); color: var(--rf-indigo-700); border-color: var(--rf-indigo-500); }

.btn-ghost { background: transparent; color: var(--rf-indigo-700); border: none; padding: .25rem .5rem; }
.btn-ghost:hover { color: var(--rf-magenta-500); }

/* --- 7. Cards ---------------------------------------------------------- */
.card {
  border: 1px solid var(--rf-neutral-200);
  border-radius: 16px;
  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
  background: #fff;
}
.card:hover {
  box-shadow: var(--rf-shadow-3);
  transform: translateY(-2px);
  border-color: var(--rf-indigo-200);
}

.card-product .card-img-top { aspect-ratio: 16 / 10; object-fit: cover; }
.card-industry { border-radius: 24px; background: var(--rf-grad-soft); padding: 1.75rem; }
.card-industry .card-icon { width: 56px; height: 56px; display:inline-flex; align-items:center; justify-content:center; border-radius: 16px; background: var(--rf-indigo-50); color: var(--rf-indigo-700); margin-bottom: 1rem; font-size: 1.5rem; }

.card-stat { padding: 1.5rem; border-radius: 16px; background: #fff; height: 100%; }
.card-stat .stat-value { font-family: 'Plus Jakarta Sans', sans-serif; font-size: 2.25rem; font-weight: 700; color: var(--rf-indigo-700); line-height: 1; }
.card-stat .stat-label { font-size: .875rem; color: var(--rf-neutral-600); margin-top: .5rem; }

/* --- 8. Chips ---------------------------------------------------------- */
.chip {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .35rem .85rem;
  background-color: var(--rf-indigo-50);
  color: var(--rf-indigo-700);
  border-radius: 9999px;
  font-size: .8125rem;
  font-weight: 500;
  border: 1px solid var(--rf-indigo-100);
}
.chip--accent { background-color: var(--rf-magenta-50); color: var(--rf-magenta-700); border-color: var(--rf-magenta-100); }
.chip--dark   { background-color: rgba(255,255,255,0.1); color: #fff; border-color: rgba(255,255,255,0.2); }

/* --- 9. Spec tables ---------------------------------------------------- */
.spec-table {
  width: 100%;
  border-collapse: collapse;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--rf-neutral-200);
}
.spec-table th, .spec-table td {
  padding: .9rem 1rem;
  border-bottom: 1px solid var(--rf-neutral-200);
  text-align: left;
  vertical-align: top;
}
.spec-table th { background: var(--rf-indigo-50); color: var(--rf-indigo-900); font-weight: 600; font-size: .875rem; }
.spec-table tbody tr:nth-child(even) { background: var(--rf-neutral-50); }
.spec-table tbody tr:last-child td { border-bottom: 0; }
.spec-table .value { font-family: 'JetBrains Mono', monospace; font-size: .9rem; color: var(--rf-neutral-800); }
.spec-table .method { color: var(--rf-neutral-500); font-size: .8125rem; }

/* --- 10. Navigation --------------------------------------------------- */
.navbar-rf {
  position: sticky; top: 0; z-index: 1030;
  background-color: rgba(255,255,255,0.95);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid transparent;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.navbar-rf.is-scrolled { border-bottom-color: var(--rf-neutral-200); box-shadow: 0 2px 8px rgba(26,25,57,0.04); }

.navbar-brand { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 700; font-size: 1.5rem; color: var(--rf-indigo-900); letter-spacing: -0.02em; }
.navbar-brand:hover { color: var(--rf-indigo-700); }
.navbar-brand .brand-dot { display:inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--rf-grad-brand); margin-right: .5rem; vertical-align: middle; }

/* Brand logo image */
.brand-logo { display: inline-flex; align-items: center; line-height: 0; padding: 4px 0; position: relative; transition: transform .25s ease; }
.brand-logo::after {
  content: "";
  position: absolute;
  inset: -4px -10px;
  background: var(--rf-grad-brand);
  border-radius: 16px;
  opacity: 0;
  z-index: -1;
  filter: blur(20px);
  transition: opacity .3s ease;
}
.brand-logo:hover { transform: translateY(-1px); }
.brand-logo:hover::after { opacity: 0.18; }
.brand-logo img {
  height: 60px;
  width: auto;
  display: block;
  filter: drop-shadow(0 2px 6px rgba(82,78,162,0.10));
  transition: filter .25s ease;
}
.brand-logo:hover img { filter: drop-shadow(0 6px 14px rgba(82,78,162,0.18)); }
.brand-logo--inverted img { filter: brightness(0) invert(1); transition: filter .25s ease; }
.brand-logo--inverted:hover img { filter: drop-shadow(0 4px 10px rgba(0,0,0,0.4)); }
@media (max-width: 991.98px) { .brand-logo img { height: 52px; } }
@media (max-width: 575.98px) { .brand-logo img { height: 44px; } }

/* Navbar gets a bit more breathing room for the bigger logo */
.navbar-rf .py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }

.nav-link-rf {
  color: var(--rf-neutral-700) !important;
  font-weight: 500;
  padding: .5rem .9rem !important;
  border-radius: 8px;
  transition: color .15s ease, background-color .15s ease;
}
.nav-link-rf:hover, .nav-link-rf.active { color: var(--rf-indigo-700) !important; background-color: var(--rf-indigo-50); }

.utility-strip {
  background: var(--rf-indigo-50);
  color: var(--rf-indigo-700);
  font-size: .8125rem;
  padding: .35rem 0;
  border-bottom: 1px solid var(--rf-indigo-100);
}
.utility-strip a { color: var(--rf-indigo-700); }

.mega-menu {
  border-radius: 16px;
  padding: 1.5rem;
  border: 1px solid var(--rf-neutral-200);
  box-shadow: var(--rf-shadow-3);
  min-width: 720px;
}
.mega-col-title { font-size: .8125rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--rf-neutral-500); font-weight: 600; margin-bottom: .75rem; }
.mega-link { display:block; padding: .5rem 0; color: var(--rf-neutral-800); font-weight: 500; }
.mega-link:hover { color: var(--rf-magenta-500); text-decoration: none; }

/* --- 11. Hero --------------------------------------------------------- */
.hero {
  position: relative;
  padding: 3rem 0 3rem;
  overflow: hidden;
}
@media (min-width: 992px) { .hero { padding: 4.5rem 0 5rem; } }

/* Page hero with background image */
.page-hero {
  position: relative;
  overflow: hidden;
  padding: 4rem 0;
  background-color: var(--rf-indigo-900);
  color: #fff;
  isolation: isolate;
}
@media (min-width: 992px) { .page-hero { padding: 5.5rem 0 5rem; } }
.page-hero h1, .page-hero .display-2, .page-hero .display-3, .page-hero .display-4 { color: #fff; }
.page-hero .lead { color: rgba(255,255,255,0.88); }
.page-hero .eyebrow { color: var(--rf-magenta-400); }
.page-hero a:not(.btn) { color: #fff; text-decoration: underline; }
.page-hero .breadcrumb-item.active { color: #fff; }
.page-hero .breadcrumb-item a { color: rgba(255,255,255,0.7); }

.page-hero-bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.page-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(135deg, rgba(26,25,57,0.92) 0%, rgba(82,78,162,0.75) 60%, rgba(236,0,139,0.55) 100%);
}
.page-hero-overlay--dark {
  background: linear-gradient(180deg, rgba(26,25,57,0.85), rgba(26,25,57,0.7));
}
.hero h1, .hero .display-2, .hero .display-1 { color: var(--rf-indigo-900); }
.hero .lead { font-size: 1.25rem; color: var(--rf-neutral-700); }
.hero--dark { background: var(--rf-indigo-900); color: #fff; }
.hero--dark h1, .hero--dark .display-2 { color: #fff; }
.hero--dark .lead { color: rgba(255,255,255,0.85); }
.hero--gradient { background: var(--rf-grad-brand); color: #fff; }
.hero--gradient h1, .hero--gradient .display-2 { color: #fff; }
.hero--gradient .lead { color: rgba(255,255,255,0.92); }
.hero--gradient .eyebrow { color: rgba(255,255,255,0.85); }

.hero-blob {
  position: absolute;
  pointer-events: none;
  width: 540px; height: 540px;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.5;
}
.hero-blob--indigo { background: var(--rf-indigo-300); top: -120px; right: -120px; }
.hero-blob--magenta { background: var(--rf-magenta-200); bottom: -180px; left: -180px; }

/* --- Hero slider (carousel) ----------------------------------------- */
.hero-slider { position: relative; overflow: hidden; }
.hero-slider .carousel { background-color: var(--rf-indigo-900); }
.hero-slider .carousel-item { min-height: 480px; transition: transform .8s ease-in-out, opacity .6s ease; }
@media (min-width: 768px)  { .hero-slider .carousel-item { min-height: 540px; } }
@media (min-width: 992px)  { .hero-slider .carousel-item { min-height: 620px; } }
@media (min-width: 1400px) { .hero-slider .carousel-item { min-height: 680px; } }
.hero-slider .slide {
  position: relative;
  height: 100%;
  min-height: inherit;
  display: flex;
  align-items: center;
  padding: 3rem 0;
  overflow: hidden;
  isolation: isolate;
}
@media (min-width: 992px) { .hero-slider .slide { padding: 4rem 0; } }

/* Slide background image layer + Ken Burns zoom */
.hero-slider .slide-image {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  z-index: -2;
  transform: scale(1.04);
}
.hero-slider .carousel-item.active .slide-image {
  animation: rfKenBurns 9s ease-out forwards;
}
@keyframes rfKenBurns {
  0%   { transform: scale(1.04) translate(0, 0); }
  100% { transform: scale(1.14) translate(-1%, -1%); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slider .carousel-item.active .slide-image { animation: none; }
}

/* Slide overlay layer — gradient on top of photo */
.hero-slider .slide-overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
}

/* Animated entrance for slide content */
.hero-slider .carousel-item.active .slide-anim-in {
  animation: rfSlideIn .9s cubic-bezier(.22, 1, .36, 1) both;
}
.hero-slider .carousel-item.active .slide-anim-in.delay-1 { animation-delay: .15s; }
.hero-slider .carousel-item.active .slide-anim-in.delay-2 { animation-delay: .3s; }
.hero-slider .carousel-item.active .slide-anim-in.delay-3 { animation-delay: .45s; }
.hero-slider .carousel-item.active .slide-anim-in.delay-4 { animation-delay: .6s; }
@keyframes rfSlideIn {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}

.hero-slider .slide-content { position: relative; z-index: 2; color: #fff; }
.hero-slider .slide-content h1,
.hero-slider .slide-content h2,
.hero-slider .slide-content .display-2 { color: #fff; }
.hero-slider .slide-content .lead { color: rgba(255,255,255,0.92); }
.hero-slider .slide-content .eyebrow { color: var(--rf-magenta-400); }

/* Slide-specific overlays — each tints the background photo differently */
.hero-slider .slide--care .slide-overlay {
  background:
    linear-gradient(110deg, rgba(26,25,57,0.86) 0%, rgba(82,78,162,0.55) 50%, rgba(236,0,139,0.42) 100%);
}
.hero-slider .slide--manufacturing .slide-overlay {
  background:
    linear-gradient(95deg, rgba(26,25,57,0.92) 0%, rgba(82,78,162,0.55) 65%, rgba(236,0,139,0.35) 100%);
}
.hero-slider .slide--sustainability .slide-overlay {
  background:
    linear-gradient(125deg, rgba(26,25,57,0.85) 0%, rgba(82,78,162,0.55) 55%, rgba(22,163,74,0.35) 100%);
}
.hero-slider .slide--portfolio .slide-overlay {
  background:
    linear-gradient(120deg, rgba(26,25,57,0.92) 0%, rgba(82,78,162,0.5) 50%, rgba(236,0,139,0.55) 100%);
}

/* Carousel controls */
.hero-slider .carousel-control-prev,
.hero-slider .carousel-control-next {
  width: 56px;
  opacity: 0.85;
  z-index: 5;
}
.hero-slider .carousel-control-prev-icon,
.hero-slider .carousel-control-next-icon {
  width: 44px; height: 44px;
  background-color: rgba(255,255,255,0.18);
  border-radius: 50%;
  background-size: 18px 18px;
  backdrop-filter: blur(8px);
}
.hero-slider .carousel-control-prev:hover .carousel-control-prev-icon,
.hero-slider .carousel-control-next:hover .carousel-control-next-icon {
  background-color: var(--rf-magenta-500);
}

/* Indicators (pills) */
.hero-slider .carousel-indicators {
  margin-bottom: 1.5rem; gap: .5rem; z-index: 4;
}
.hero-slider .carousel-indicators [data-bs-target] {
  width: 28px; height: 4px;
  background-color: rgba(255,255,255,0.4);
  border: 0; border-radius: 4px;
  opacity: 1;
  transition: background-color .2s ease, width .25s ease;
  position: relative;
  overflow: hidden;
}
.hero-slider .carousel-indicators .active {
  background-color: rgba(255,255,255,0.25);
  width: 56px;
}
.hero-slider .carousel-indicators .active::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--rf-magenta-400), #fff);
  animation: rfProgress 5s linear forwards;
  transform-origin: left center;
}
@keyframes rfProgress {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slider .carousel-indicators .active::after { animation: none; transform: scaleX(1); }
  .hero-slider .carousel-item { transition: none !important; }
}

/* --- 12. Footer ------------------------------------------------------- */
.footer {
  background-color: var(--rf-indigo-900);
  color: #d4d4d4;
  padding: 4rem 0 1.5rem;
}
.footer h6 { color: #fff; font-size: .875rem; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 1rem; font-weight: 700; }
.footer a { color: #d4d4d4; }
.footer a:hover { color: var(--rf-magenta-400); text-decoration: none; }
.footer .footer-bottom { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1.25rem; margin-top: 2.5rem; font-size: .8125rem; color: rgba(255,255,255,0.6); }
.footer .social-link { display:inline-flex; align-items:center; justify-content:center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.08); margin-right: .5rem; color: #fff; }
.footer .social-link:hover { background: var(--rf-magenta-500); color: #fff; }

/* --- 13. Forms -------------------------------------------------------- */
.form-control, .form-select {
  border: 1px solid var(--rf-neutral-300);
  border-radius: 10px;
  padding: .65rem .9rem;
  font-size: 1rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--rf-indigo-500);
  box-shadow: 0 0 0 3px rgba(82,78,162,0.18);
}
.form-label { font-weight: 600; color: var(--rf-neutral-700); font-size: .875rem; margin-bottom: .35rem; }
.form-text { font-size: .8125rem; color: var(--rf-neutral-500); }
.form-honeypot { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* --- 14. Accordion (FAQ) --------------------------------------------- */
.accordion-button {
  font-weight: 600;
  color: var(--rf-indigo-900);
  background: #fff;
}
.accordion-button:not(.collapsed) { background: var(--rf-indigo-50); color: var(--rf-indigo-900); box-shadow: none; }
.accordion-button:focus { box-shadow: 0 0 0 3px rgba(82,78,162,0.2); }

/* --- 15. CTA band ----------------------------------------------------- */
.cta-band {
  background: var(--rf-indigo-900);
  color: #fff;
  border-radius: 24px;
  padding: 3rem;
  position: relative;
  overflow: hidden;
}
.cta-band::before {
  content: "";
  position: absolute; inset: -2px;
  background: var(--rf-grad-brand);
  opacity: 0.12;
  pointer-events: none;
}
.cta-band > * { position: relative; }
.cta-band h2, .cta-band h3 { color: #fff; }
.cta-band .lead { color: rgba(255,255,255,0.85); }

/* --- 16. Breadcrumb --------------------------------------------------- */
.breadcrumb { font-size: .875rem; }
.breadcrumb a { color: var(--rf-neutral-500); }
.breadcrumb a:hover { color: var(--rf-indigo-700); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--rf-neutral-400); }
.breadcrumb-item.active { color: var(--rf-indigo-700); font-weight: 500; }

/* --- 17. Utilities ---------------------------------------------------- */
.divider-rf { height: 4px; width: 64px; background: var(--rf-grad-brand); border-radius: 4px; margin-bottom: 1.5rem; }
.rounded-rf-lg { border-radius: 16px; }
.rounded-rf-xl { border-radius: 24px; }
.shadow-rf { box-shadow: var(--rf-shadow-2); }
.shadow-rf-lg { box-shadow: var(--rf-shadow-3); }
.shadow-rf-brand { box-shadow: var(--rf-shadow-brand); }

.divider-line { height: 1px; background: var(--rf-neutral-200); margin: 4rem 0; }

.icon-pill { display:inline-flex; align-items:center; justify-content:center; width: 48px; height: 48px; border-radius: 12px; background: var(--rf-indigo-50); color: var(--rf-indigo-700); font-size: 1.25rem; }
.icon-pill--accent { background: var(--rf-magenta-50); color: var(--rf-magenta-600); }

/* --- 18. Matrix tables (industry pages) ------------------------------- */
.matrix-table { width: 100%; border-collapse: collapse; }
.matrix-table th, .matrix-table td { padding: .75rem .9rem; border: 1px solid var(--rf-neutral-200); text-align: center; font-size: .9rem; }
.matrix-table thead th { background: var(--rf-indigo-50); color: var(--rf-indigo-900); }
.matrix-table tbody td:first-child { text-align: left; font-weight: 600; color: var(--rf-indigo-700); background: var(--rf-neutral-50); }

/* --- 19. Glossary list ------------------------------------------------ */
.glossary-list dt { font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 700; color: var(--rf-indigo-900); font-size: 1.0625rem; margin-bottom: .25rem; }
.glossary-list dd { color: var(--rf-neutral-700); margin-bottom: 1.5rem; }

/* --- 20. Scroll reveal & motion ------------------------------------- */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

.reveal-up   { opacity: 0; transform: translateY(40px); transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
.reveal-up.is-visible { opacity: 1; transform: translateY(0); }

.reveal-left { opacity: 0; transform: translateX(-40px); transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
.reveal-left.is-visible { opacity: 1; transform: translateX(0); }

.reveal-right { opacity: 0; transform: translateX(40px); transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
.reveal-right.is-visible { opacity: 1; transform: translateX(0); }

.reveal-scale { opacity: 0; transform: scale(.94); transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
.reveal-scale.is-visible { opacity: 1; transform: scale(1); }

/* Staggered children */
.reveal-stagger > * { opacity: 0; transform: translateY(24px); transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
.reveal-stagger.is-visible > *:nth-child(1) { transition-delay: .05s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(2) { transition-delay: .15s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(3) { transition-delay: .25s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(4) { transition-delay: .35s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(5) { transition-delay: .45s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(6) { transition-delay: .55s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(7) { transition-delay: .65s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(8) { transition-delay: .75s; opacity: 1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(n+9) { transition-delay: .85s; opacity: 1; transform: translateY(0); }

/* Parallax wrapper — moves slightly slower than scroll */
.parallax { will-change: transform; transition: transform .1s linear; }

/* Floating gentle drift for decorative blobs */
@keyframes rfFloat {
  0%, 100% { transform: translateY(0) translateX(0); }
  50%      { transform: translateY(-12px) translateX(8px); }
}
.float-slow { animation: rfFloat 8s ease-in-out infinite; }

/* Count-up reveal */
.count-up { display: inline-block; font-variant-numeric: tabular-nums; }

/* Image card hover lift */
.card-image-hover { overflow: hidden; }
.card-image-hover img { transition: transform .6s cubic-bezier(.22,1,.36,1); }
.card-image-hover:hover img { transform: scale(1.06); }

/* Decorative section divider with brand gradient */
.section-divider {
  height: 6px;
  background: var(--rf-grad-brand);
  border-radius: 6px;
  width: 96px;
  margin: 0 auto 2.5rem;
}

/* --- 21. Print -------------------------------------------------------- */
@media print {
  .navbar-rf, .footer, .cta-band, .utility-strip, .btn { display: none !important; }
  body { color: #000; }
}

/* --- 22. Reduced motion ---------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* --- 23. Focus visibility -------------------------------------------- */
:focus-visible {
  outline: 2px solid var(--rf-magenta-500);
  outline-offset: 2px;
  border-radius: 4px;
}

/* --- 24. Skip-to-content --------------------------------------------- */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: var(--rf-indigo-900);
  color: #fff;
  padding: .5rem 1rem;
  z-index: 10000;
  border-radius: 0 0 8px 0;
}
.skip-link:focus { top: 0; color: #fff; }