/* R3 warm trust brand layer. Loaded last to soften older dark/AI-first pages. */
:root {
  --bg: #fffaf4;
  --ink: #302722;
  --muted: #766b62;
  --line: rgba(99, 75, 61, 0.18);
  --blue: #b8795b;
  --green: #526b50;
  --panel: rgba(255, 253, 248, 0.88);
  --r3-paper: #fffaf4;
  --r3-cream: #f7efe6;
  --r3-clay: #b8795b;
  --r3-rose: #c9827a;
  --r3-sage: #758d6f;
  --r3-moss: #526b50;
  --r3-ink: #302722;
  --r3-muted: #766b62;
  --r3-line: rgba(99, 75, 61, 0.18);
  --r3-panel: rgba(255, 253, 248, 0.86);
  --r3-shadow: 0 20px 60px rgba(83, 60, 48, 0.10);
}

html { background: var(--r3-paper); }

body {
  background:
    radial-gradient(circle at 18% 8%, rgba(201, 130, 122, 0.16), transparent 30rem),
    radial-gradient(circle at 86% 18%, rgba(117, 141, 111, 0.14), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 58%, #eef3e8 100%) !important;
  color: var(--r3-ink) !important;
}

.glass-panel,
.panel,
.card,
.tool-card,
.sector-card,
.sr-card,
[class*="bg-black"],
[class*="bg-zinc"],
[class*="bg-slate"],
[class*="bg-gray-9"],
[style*="background:#0f172a"],
[style*="background: #0f172a"] {
  background: var(--r3-panel) !important;
  border-color: var(--r3-line) !important;
  box-shadow: var(--r3-shadow);
  color: var(--r3-ink) !important;
}

nav,
header.top,
.top,
.sr-progress {
  background: rgba(255, 250, 244, 0.94) !important;
  border-color: var(--r3-line) !important;
  color: var(--r3-ink) !important;
  backdrop-filter: blur(16px);
}

section#showroom,
section#showroom.bg-black {
  background:
    radial-gradient(circle at 14% 12%, rgba(201, 130, 122, 0.12), transparent 28rem),
    radial-gradient(circle at 86% 16%, rgba(117, 141, 111, 0.14), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 56%, #eef3e8 100%) !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

#showroom .sr-progress {
  background: rgba(255, 250, 244, 0.94) !important;
  border-bottom: 1px solid var(--r3-line) !important;
  box-shadow: 0 12px 34px rgba(83, 60, 48, 0.08) !important;
}

#showroom .sr-step-dot .dot,
#showroom .sr-connector .fill,
#showroom .sr-tab.active,
#showroom .sr-hotspot-ping {
  background: var(--r3-moss) !important;
}

#showroom .sr-step-dot.active .dot {
  box-shadow: 0 0 12px rgba(82, 107, 80, 0.36), 0 0 24px rgba(82, 107, 80, 0.18) !important;
}

#showroom .sr-step-dot .dot-label,
#showroom .sr-tab,
#showroom .sr-browser-url {
  color: var(--r3-muted) !important;
}

#showroom .sr-step-dot.active .dot-label,
#showroom .sr-tab.active {
  color: var(--r3-ink) !important;
}

#showroom .sr-connector {
  background: rgba(105, 80, 62, 0.16) !important;
}

#showroom .sr-hotspot-ping:before {
  border-color: var(--r3-moss) !important;
}

#showroom .sr-hotspot-label {
  background: rgba(255, 253, 248, 0.94) !important;
  color: var(--r3-ink) !important;
  border-color: rgba(119, 144, 111, 0.34) !important;
}

h1,
h2,
h3,
h4,
.brand strong,
.text-white,
.text-gray-100,
.text-gray-200,
.text-gray-300 {
  color: var(--r3-ink) !important;
}

p,
li,
.lead,
.muted,
.text-gray-400,
.text-gray-500,
.text-slate-400,
.text-slate-500 {
  color: var(--r3-muted) !important;
}

.text-blue-400,
.text-blue-300,
.text-blue-500,
.text-cyan-300,
.text-cyan-400,
.text-cyan-500,
.text-emerald-300,
.text-green-400,
.text-green-500,
.text-purple-300,
.text-purple-400,
.text-purple-500,
.text-transparent,
.eyebrow {
  color: var(--r3-clay) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}

.bg-gradient-to-r,
.bg-gradient-to-br,
.bg-gradient-to-tr,
.bg-gradient-to-b,
.bar-fill,
.cta,
.btn,
button,
a[class*="from-blue"],
a[class*="to-purple"],
a[class*="bg-white"],
a[class*="bg-emerald"],
a[class*="bg-blue"],
a[class*="bg-gradient"] {
  background: var(--r3-moss) !important;
  color: #fffaf4 !important;
  border-color: rgba(82, 107, 80, 0.30) !important;
  box-shadow: 0 14px 32px rgba(82, 107, 80, 0.18) !important;
}

.btn.secondary,
a[class*="border"],
button[class*="border"] {
  background: rgba(255, 253, 248, 0.70) !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

.bg-blue-500,
.bg-blue-600,
.bg-blue-500\/20,
.bg-blue-600\/20,
.bg-blue-500\/5,
.bg-blue-600\/5,
.bg-purple-500,
.bg-purple-600,
.bg-purple-500\/5,
.bg-purple-500\/20,
.bg-purple-600\/5,
.bg-purple-600\/20,
.bg-cyan-500\/5,
.bg-green-500\/5,
.bg-yellow-600\/5,
.bg-yellow-600\/10,
.from-blue-400,
.from-blue-500,
.from-blue-500\/10,
.from-blue-500\/20,
.from-blue-950\/20,
.to-purple-500,
.to-purple-600,
.to-purple-950\/20,
.via-blue-500\/20,
.via-blue-950\/10 {
  background: linear-gradient(135deg, var(--r3-clay), var(--r3-sage)) !important;
}

.from-blue-500\/20.to-transparent,
.from-blue-500\/10.to-transparent,
.bg-gradient-to-b.from-blue-500\/20,
.bg-gradient-to-b.from-blue-500\/10 {
  background: linear-gradient(180deg, rgba(119, 144, 111, 0.20), rgba(185, 121, 91, 0.04), transparent) !important;
}

.border-blue-500\/20,
.border-blue-500\/30,
.border-blue-500\/50,
.border-purple-500\/20,
.border-purple-500\/30,
.border-purple-500\/50,
.border-cyan-500\/20,
.border-green-500\/20,
.border-yellow-600\/20,
.hover\:border-blue-500\/30:hover,
.hover\:border-blue-500\/50:hover,
.hover\:border-purple-500\/30:hover,
.hover\:border-purple-500\/50:hover {
  border-color: rgba(119, 144, 111, 0.34) !important;
}

.shadow-blue-500\/10,
.shadow-blue-500\/20,
.shadow-blue-500\/30,
.shadow-blue-500\/40,
.shadow-purple-500\/10,
.shadow-purple-500\/20,
.shadow-purple-500\/30,
.shadow-purple-500\/40 {
  box-shadow: 0 14px 34px rgba(82, 107, 80, 0.18) !important;
}

.text-transparent.bg-clip-text,
.bg-clip-text {
  background: none !important;
  color: var(--r3-clay) !important;
  -webkit-text-fill-color: var(--r3-clay) !important;
}

span.bg-blue-500,
span.bg-blue-500\/20,
span.bg-blue-500\/5,
span.bg-purple-500,
span.bg-purple-500\/20,
span.bg-purple-500\/5,
span.bg-cyan-500\/5,
span.bg-green-500\/5,
span.bg-yellow-600\/10,
div.bg-blue-500\/20,
div.bg-blue-600\/20,
div.bg-blue-600\/5,
div.bg-purple-500\/20,
div.bg-purple-600\/5,
div.bg-purple-600\/20,
div.bg-yellow-600\/10 {
  background: rgba(119, 144, 111, 0.18) !important;
  color: var(--r3-moss) !important;
  -webkit-text-fill-color: var(--r3-moss) !important;
}

.hero,
section,
footer {
  border-color: var(--r3-line) !important;
}

body .hero {
  background:
    radial-gradient(circle at 16% 10%, rgba(201, 130, 122, 0.15), transparent 28rem),
    radial-gradient(circle at 86% 18%, rgba(117, 141, 111, 0.15), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 62%, #fffdf8 100%) !important;
  color: var(--r3-ink) !important;
  border-bottom: 1px solid var(--r3-line) !important;
}

html body main > section.hero,
html body section.hero,
body main section.hero {
  background:
    radial-gradient(circle at 16% 10%, rgba(201, 130, 122, 0.15), transparent 28rem),
    radial-gradient(circle at 86% 18%, rgba(117, 141, 111, 0.15), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 62%, #fffdf8 100%) !important;
  color: var(--r3-ink) !important;
}

body .hero h1,
body .hero h2,
body .hero h3 {
  color: var(--r3-ink) !important;
  text-shadow: none !important;
}

html body main > section.hero h1,
html body main > section.hero h2,
html body main > section.hero h3,
html body main > section.hero .eyebrow {
  color: var(--r3-ink) !important;
  -webkit-text-fill-color: var(--r3-ink) !important;
  text-shadow: none !important;
}

body .hero .lead,
body .hero p {
  color: var(--r3-muted) !important;
}

html body main > section.hero .lead,
html body main > section.hero p {
  color: var(--r3-muted) !important;
  -webkit-text-fill-color: var(--r3-muted) !important;
}

body .hero .cta,
body .hero a.cta {
  background: var(--r3-moss) !important;
  color: #fffaf4 !important;
  -webkit-text-fill-color: #fffaf4 !important;
  border-color: rgba(82, 107, 80, 0.30) !important;
  box-shadow: 0 14px 34px rgba(82, 107, 80, 0.20) !important;
}

body .hero .cta.secondary,
body .hero a.cta.secondary {
  background: rgba(255, 253, 248, 0.72) !important;
  color: var(--r3-ink) !important;
  -webkit-text-fill-color: var(--r3-ink) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: none !important;
}

body .hero .wrap {
  position: relative;
}

body .grid,
body .split,
body .panel,
body .card {
  border-color: var(--r3-line) !important;
}

body .grid {
  background: var(--r3-line) !important;
}

body .panel,
body .card {
  background: rgba(255, 253, 248, 0.88) !important;
  color: var(--r3-ink) !important;
}

body .panel p,
body .panel li,
body .card p,
body .chip,
body .links,
body .brand span,
body .footer {
  color: var(--r3-muted) !important;
}

.r3-state-mark,
.r3-industry-mark {
  position: absolute;
  right: 0;
  top: 0;
  width: clamp(92px, 14vw, 138px);
  aspect-ratio: 1;
  border-radius: 32px;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 28% 24%, rgba(255, 253, 248, 0.86), transparent 3.8rem),
    linear-gradient(135deg, rgba(185, 121, 91, 0.20), rgba(82, 107, 80, 0.22));
  border: 1px solid var(--r3-line);
  box-shadow: 0 20px 56px rgba(83, 60, 48, 0.12);
  color: var(--r3-moss);
  font-size: clamp(1.7rem, 4.2vw, 3.4rem);
  font-weight: 950;
  letter-spacing: 0;
}

.r3-state-mark small,
.r3-industry-mark small {
  display: block;
  margin-top: 6px;
  color: var(--r3-clay);
  font-size: 0.62rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-align: center;
}

.r3-state-mark span,
.r3-industry-mark span {
  text-align: center;
  line-height: 0.92;
}

@media (max-width: 760px) {
  .r3-state-mark,
  .r3-industry-mark {
    position: static;
    width: 88px;
    margin: 28px 0 0;
    border-radius: 24px;
  }
}

.sector-content,
.sr-preview-overlay,
.absolute.inset-0.bg-black\/60 {
  background: linear-gradient(to top, rgba(48, 39, 34, 0.52), rgba(255, 250, 244, 0.10)) !important;
}

#r3-chat-btn,
#r3-fb-bubble,
#r3mc-btn,
button#r3-chat-btn,
.fixed #r3-chat-btn,
[id="r3-chat-btn"][class*="from-blue"],
[id="r3-chat-btn"][class*="to-purple"] {
  background: var(--r3-moss) !important;
  color: #fffaf4 !important;
  -webkit-text-fill-color: #fffaf4 !important;
  border: 1px solid rgba(255, 250, 244, 0.22) !important;
  box-shadow: 0 16px 36px rgba(82, 107, 80, 0.24) !important;
}

#r3-fb-panel,
#r3mc-panel {
  background: #fffdf8 !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

#r3-universal-popup .r3p-card {
  background: linear-gradient(135deg, #fffdf9 0%, #f7efe6 100%) !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

#r3-universal-popup .r3p-eyebrow {
  color: var(--r3-clay) !important;
  -webkit-text-fill-color: var(--r3-clay) !important;
}

#r3-universal-popup .r3p-headline {
  color: var(--r3-ink) !important;
  -webkit-text-fill-color: var(--r3-ink) !important;
  text-shadow: none !important;
}

#r3-universal-popup .r3p-sub {
  color: var(--r3-muted) !important;
  -webkit-text-fill-color: var(--r3-muted) !important;
  text-shadow: none !important;
}

#r3-universal-popup .r3p-btn,
#r3-universal-popup .r3p-btn:visited {
  background: #ffffff !important;
  color: var(--r3-ink) !important;
  -webkit-text-fill-color: var(--r3-ink) !important;
  border-color: transparent !important;
  font-weight: 900 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

#r3-universal-popup .r3p-btn:hover,
#r3-universal-popup .r3p-btn:focus {
  background: #fffdf8 !important;
  color: var(--r3-ink) !important;
  -webkit-text-fill-color: var(--r3-ink) !important;
}

.r3mc-bot {
  background: #f7efe6 !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

.r3mc-user {
  background: var(--r3-moss) !important;
  color: #fffaf4 !important;
}

.r3-industry-demo {
  background:
    radial-gradient(circle at 88% 18%, rgba(201, 149, 66, 0.12), transparent 26rem),
    linear-gradient(180deg, rgba(255, 253, 248, 0.88), rgba(247, 239, 230, 0.62)) !important;
  border-color: var(--r3-line) !important;
}

.r3-industry-demo .wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 430px);
  gap: 28px;
  align-items: stretch;
}

.r3-demo-copy,
.r3-demo-screen {
  background: rgba(255, 253, 248, 0.90) !important;
  border: 1px solid var(--r3-line) !important;
  border-radius: 18px;
  box-shadow: var(--r3-shadow);
}

.r3-demo-copy {
  padding: 30px;
}

.r3-demo-copy h2 {
  margin: 10px 0 12px;
  color: var(--r3-ink) !important;
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  line-height: 1.04;
}

.r3-demo-copy p {
  margin: 0;
  color: var(--r3-muted) !important;
  line-height: 1.65;
}

.r3-demo-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.r3-demo-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(117, 141, 111, 0.13);
  color: var(--r3-moss);
  border: 1px solid rgba(117, 141, 111, 0.22);
  font-size: 0.82rem;
  font-weight: 800;
}

.r3-demo-screen {
  padding: 16px;
  overflow: hidden;
}

.r3-demo-browser {
  min-height: 260px;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 250, 244, 0.96), rgba(247, 239, 230, 0.84)),
    linear-gradient(135deg, rgba(201, 130, 122, 0.18), rgba(117, 141, 111, 0.16));
  border: 1px solid rgba(99, 75, 61, 0.14);
  position: relative;
  padding: 54px 20px 20px;
}

.r3-demo-browser > * {
  position: relative;
  z-index: 1;
}

.r3-demo-browser:focus-within {
  outline: 2px solid rgba(82, 107, 80, 0.28);
  outline-offset: 3px;
}

.r3-demo-browser:before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 38px;
  background: rgba(255, 253, 248, 0.78);
  border-bottom: 1px solid rgba(99, 75, 61, 0.12);
}

.r3-demo-browser .r3-demo-hero:before {
  content: "";
  position: absolute;
  top: 16px;
  right: 16px;
  width: clamp(72px, 18vw, 118px);
  height: clamp(58px, 12vw, 92px);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255, 253, 248, 0.86), rgba(247, 239, 230, 0.58)),
    radial-gradient(circle at 32% 36%, rgba(185, 121, 91, 0.32), transparent 2.2rem);
  border: 1px solid rgba(99, 75, 61, 0.16);
  box-shadow: 0 16px 34px rgba(83, 60, 48, 0.12);
}

.r3-demo-browser .r3-demo-hero:after {
  content: "";
  position: absolute;
  right: 34px;
  top: 48px;
  width: clamp(42px, 10vw, 68px);
  height: 8px;
  border-radius: 999px;
  background: rgba(82, 107, 80, 0.46);
  box-shadow: 0 18px 0 rgba(185, 121, 91, 0.34), -26px 28px 0 rgba(201, 149, 66, 0.30);
}

.r3-demo-browser:after {
  content: "";
  position: absolute;
  top: 14px;
  left: 18px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--r3-rose);
  box-shadow: 16px 0 0 var(--r3-gold, #c99542), 32px 0 0 var(--r3-sage);
}

.r3-demo-hero {
  min-height: 112px;
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(82, 107, 80, 0.22), rgba(185, 121, 91, 0.16)),
    repeating-linear-gradient(0deg, rgba(255,255,255,0.24), rgba(255,255,255,0.24) 10px, rgba(255,255,255,0.06) 10px, rgba(255,255,255,0.06) 20px);
  display: flex;
  align-items: flex-end;
  padding: 18px;
  color: var(--r3-ink);
  font-weight: 900;
  line-height: 1.05;
  position: relative;
  overflow: hidden;
}

.r3-demo-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}

.r3-industry-demo .r3-demo-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 10px !important;
}

.r3-demo-tile {
  min-height: 72px;
  border-radius: 12px;
  padding: 12px;
  background: rgba(255, 253, 248, 0.76);
  border: 1px solid rgba(99, 75, 61, 0.12);
  color: var(--r3-muted);
  font-size: 0.82rem;
  font-weight: 750;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: normal;
}

.r3-demo-tile b {
  display: block;
  color: var(--r3-ink);
  margin-bottom: 5px;
}

.r3-industry-demo .wrap:after {
  content: "";
  min-height: 130px;
  grid-column: 1 / -1;
  border-radius: 20px;
  border: 1px solid var(--r3-line);
  background:
    linear-gradient(90deg, rgba(255, 253, 248, 0.92), rgba(255, 253, 248, 0.54)),
    repeating-linear-gradient(90deg, rgba(185, 121, 91, 0.12) 0 1px, transparent 1px 68px),
    linear-gradient(135deg, rgba(201, 130, 122, 0.16), rgba(117, 141, 111, 0.15));
  box-shadow: 0 18px 44px rgba(83, 60, 48, 0.08);
}

.r3-state-mark,
.hero .eyebrow {
  position: relative;
}

.r3-state-mark:before,
.hero .eyebrow:after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 999px;
  background: rgba(117, 141, 111, 0.16);
  border: 1px solid rgba(117, 141, 111, 0.18);
}

.r3-state-mark:before {
  inset: -12px -14px;
  z-index: -1;
}

.hero .eyebrow:after {
  width: 42px;
  height: 42px;
  left: -14px;
  top: 50%;
  transform: translateY(-50%);
  z-index: -1;
}

@media (max-width: 820px) {
  .r3-industry-demo .wrap {
    grid-template-columns: 1fr;
  }
}

input,
select,
textarea {
  background: #fffdf8 !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

/* Brand alignment pass: calculator, audit request, and dark legacy sections. */
nav .text-\[9px\],
.brand span {
  color: var(--r3-muted) !important;
}

nav .font-bold,
nav .font-black,
.brand strong {
  color: var(--r3-ink) !important;
}

#calculator,
#contact,
#methodology,
#about,
#faq,
#showroom,
footer.bg-black {
  background:
    radial-gradient(circle at 10% 12%, rgba(201, 130, 122, 0.10), transparent 26rem),
    linear-gradient(180deg, rgba(255, 253, 248, 0.82), rgba(247, 239, 230, 0.72)) !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

section#calculator,
section#calculator.bg-zinc-900 {
  background:
    radial-gradient(circle at 16% 14%, rgba(201, 130, 122, 0.16), transparent 28rem),
    radial-gradient(circle at 82% 18%, rgba(117, 141, 111, 0.15), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 56%, #eef3e8 100%) !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

section#calculator > div {
  position: relative;
  z-index: 1;
}

section#calculator h2 {
  color: var(--r3-ink) !important;
  font-style: normal !important;
}

section#calculator .glass-panel {
  background: rgba(255, 253, 248, 0.90) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: 0 22px 60px rgba(83, 60, 48, 0.12) !important;
}

section#calculator input {
  background: #fffdf8 !important;
  color: var(--r3-ink) !important;
  border: 1px solid rgba(99, 75, 61, 0.20) !important;
}

section#contact,
section#contact.bg-zinc-900 {
  background:
    radial-gradient(circle at 18% 12%, rgba(201, 130, 122, 0.15), transparent 28rem),
    radial-gradient(circle at 84% 18%, rgba(117, 141, 111, 0.14), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 58%, #eef3e8 100%) !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

section#contact h2 {
  color: var(--r3-ink) !important;
  text-shadow: none !important;
}

section#contact p {
  color: var(--r3-muted) !important;
}

section#contact .glass-panel {
  background: rgba(255, 253, 248, 0.92) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: 0 24px 70px rgba(83, 60, 48, 0.13) !important;
}

section#contact label {
  color: var(--r3-muted) !important;
}

section#contact input,
section#contact select,
section#contact textarea {
  background: #fffdf8 !important;
  color: var(--r3-ink) !important;
  border: 1px solid rgba(99, 75, 61, 0.22) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72) !important;
}

section#contact input::placeholder,
section#contact textarea::placeholder {
  color: rgba(117, 104, 95, 0.62) !important;
}

section#contact button[type="submit"] {
  background: linear-gradient(135deg, var(--r3-clay), var(--r3-sage)) !important;
  color: #fffdf8 !important;
  border: 0 !important;
  box-shadow: 0 14px 34px rgba(117, 141, 111, 0.22) !important;
}

#calculator .glass-panel,
#contact .glass-panel,
#methodology .glass-panel,
#about .glass-panel,
#faq details,
#showroom .glass-panel,
#showroom .sr-preview-frame,
#showroom .sr-backend-card {
  background: rgba(255, 253, 248, 0.90) !important;
  border: 1px solid var(--r3-line) !important;
  color: var(--r3-ink) !important;
  box-shadow: var(--r3-shadow) !important;
}

#calculator h2,
#contact h2,
#methodology h2,
#about h2,
#about h3,
#about h4,
#faq h2,
#showroom h2,
#showroom h3 {
  color: var(--r3-ink) !important;
  text-shadow: none !important;
}

#calculator label,
#contact label,
#calculator .uppercase,
#contact .uppercase,
#methodology .uppercase,
#about .uppercase,
#showroom .uppercase {
  color: var(--r3-muted) !important;
}

#calculator input,
#contact input,
#contact select,
#contact textarea {
  background: #fffdf8 !important;
  color: var(--r3-ink) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7) !important;
}

#calculator input:focus,
#contact input:focus,
#contact select:focus,
#contact textarea:focus {
  border-color: rgba(82, 107, 80, .56) !important;
  box-shadow: 0 0 0 3px rgba(117, 141, 111, .16) !important;
}

#annualRiskDisplay {
  color: var(--r3-clay) !important;
  text-shadow: none !important;
}

#revenueChart {
  filter: saturate(.78) sepia(.18);
}

#timeSlots .time-slot,
.time-slot {
  background: rgba(255,253,248,.78) !important;
  border-color: var(--r3-line) !important;
  color: var(--r3-ink) !important;
}

.time-slot.selected,
.time-slot:hover {
  background: rgba(117, 141, 111, .16) !important;
  border-color: rgba(82, 107, 80, .44) !important;
  color: var(--r3-moss) !important;
}

::selection {
  background: rgba(184, 121, 91, 0.26);
  color: var(--r3-ink);
}

/* Visual proof layer: gentle icons, sample cards, and owner-facing demo panels. */
.r3-visual-section {
  border-top: 1px solid var(--r3-line) !important;
  background:
    linear-gradient(180deg, rgba(255, 253, 248, 0.78), rgba(247, 239, 230, 0.62)),
    radial-gradient(circle at 8% 14%, rgba(201, 130, 122, 0.12), transparent 26rem);
}

.r3-visual-wrap {
  max-width: 1120px;
  margin: 0 auto;
  padding: 76px 24px;
}

.r3-visual-kicker,
.r3-demo-kicker {
  color: var(--r3-clay) !important;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.r3-visual-title {
  color: var(--r3-ink) !important;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.02;
  margin: 14px 0 16px;
  letter-spacing: 0;
}

.r3-visual-lede {
  color: var(--r3-muted) !important;
  max-width: 760px;
  font-size: 1.08rem;
  line-height: 1.65;
}

.r3-demo-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
  gap: 24px;
  align-items: stretch;
  margin-top: 32px;
}

.r3-demo-board,
.r3-demo-side,
.r3-demo-card {
  background: rgba(255, 253, 248, 0.88) !important;
  border: 1px solid var(--r3-line) !important;
  border-radius: 18px !important;
  box-shadow: var(--r3-shadow);
}

.r3-demo-board {
  padding: 24px;
}

.r3-demo-window {
  overflow: hidden;
  border: 1px solid var(--r3-line);
  border-radius: 14px;
  background: #fffdf8;
}

.r3-demo-bar {
  display: flex;
  gap: 7px;
  align-items: center;
  padding: 12px 14px;
  background: #f3e8de;
  border-bottom: 1px solid var(--r3-line);
}

.r3-demo-bar span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--r3-clay);
  opacity: 0.72;
}

.r3-demo-bar span:nth-child(2) { background: #d4a373; }
.r3-demo-bar span:nth-child(3) { background: var(--r3-sage); }

.r3-demo-body {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.r3-demo-board .r3-demo-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid rgba(99, 75, 61, 0.12);
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(247, 239, 230, 0.55), rgba(255, 253, 248, 0.9));
}

.r3-demo-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #edf3e9;
  color: var(--r3-moss);
  font-weight: 900;
}

.r3-demo-board .r3-demo-row strong,
.r3-demo-card strong {
  display: block;
  color: var(--r3-ink);
  font-weight: 850;
}

.r3-demo-board .r3-demo-row small,
.r3-demo-card small {
  display: block;
  color: var(--r3-muted);
  line-height: 1.45;
}

.r3-demo-pill {
  border-radius: 999px;
  background: #f8dfcf;
  color: #754333;
  padding: 7px 10px;
  font-size: 0.72rem;
  font-weight: 850;
  white-space: nowrap;
}

.r3-demo-side {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.r3-demo-card {
  padding: 18px;
}

.r3-demo-card::before,
.glass-panel::before,
.card::before,
.tool-card::before,
.sr-card::before {
  border-radius: 14px;
}

.r3-demo-card .r3-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  margin-bottom: 14px;
  border-radius: 12px;
  background: #f3e8de;
  color: var(--r3-clay);
  font-weight: 900;
}

.r3-soft-image {
  min-height: 220px;
  border: 1px solid var(--r3-line);
  border-radius: 18px;
  background:
    linear-gradient(135deg, rgba(255, 253, 248, 0.8), rgba(238, 243, 232, 0.86)),
    linear-gradient(120deg, rgba(184, 121, 91, 0.16), rgba(117, 141, 111, 0.14));
  position: relative;
  overflow: hidden;
}

.r3-soft-image::before,
.r3-soft-image::after {
  content: "";
  position: absolute;
  border-radius: 18px;
  background: rgba(255, 253, 248, 0.82);
  border: 1px solid rgba(99, 75, 61, 0.12);
}

.r3-soft-image::before {
  width: 54%;
  height: 46%;
  left: 8%;
  top: 16%;
  box-shadow: 0 18px 40px rgba(83, 60, 48, 0.08);
}

.r3-soft-image::after {
  width: 36%;
  height: 58%;
  right: 8%;
  bottom: 12%;
  background:
    repeating-linear-gradient(180deg, rgba(117, 141, 111, 0.18) 0 8px, transparent 8px 18px),
    rgba(255, 253, 248, 0.84);
}

.r3-icon-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 24px;
}

.r3-icon-item {
  padding: 16px;
  border: 1px solid var(--r3-line);
  border-radius: 14px;
  background: rgba(255, 253, 248, 0.72);
}

.r3-icon-item b {
  display: block;
  color: var(--r3-ink);
  margin-bottom: 4px;
}

.r3-icon-item span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: #edf3e9;
  color: var(--r3-moss);
  font-weight: 900;
}

.sector-card .sector-content > div:first-child,
.glass-panel i,
.card span {
  color: var(--r3-clay) !important;
}

/* Industries page/section: keep the real trade photos, but make the frame match
   the softer follow-up recovery brand. */
#sectors {
  background:
    radial-gradient(circle at 14% 10%, rgba(201, 130, 122, 0.14), transparent 28rem),
    radial-gradient(circle at 86% 16%, rgba(117, 141, 111, 0.16), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 56%, #eef3e8 100%) !important;
  border-color: var(--r3-line) !important;
}

#sectors h2 {
  color: var(--r3-ink) !important;
  font-style: normal !important;
  letter-spacing: 0 !important;
}

#sectors > div > p {
  color: var(--r3-clay) !important;
  letter-spacing: 0.14em !important;
}

#sectors .glass-panel,
#sectors button {
  background: rgba(255, 253, 248, 0.92) !important;
  color: var(--r3-ink) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: 0 14px 34px rgba(83, 60, 48, 0.14) !important;
}

#sector-track {
  scrollbar-color: rgba(82, 107, 80, 0.36) transparent;
}

#sectors .sector-card,
#sectors a.block.group.relative {
  background: rgba(255, 253, 248, 0.92) !important;
  border: 1px solid rgba(99, 75, 61, 0.18) !important;
  border-radius: 18px !important;
  box-shadow: 0 22px 60px rgba(83, 60, 48, 0.13) !important;
}

#sectors .sector-card:before,
#sectors a.block.group.relative > img {
  opacity: 0.72 !important;
  filter: saturate(0.86) sepia(0.12) brightness(1.04) contrast(0.9);
}

#sectors .sector-card:hover:before,
#sectors a.block.group.relative:hover > img {
  opacity: 0.84 !important;
}

#sectors .sector-card:after,
#sectors a.block.group.relative:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255, 250, 244, 0.16), rgba(255, 250, 244, 0.05) 35%),
    linear-gradient(to top, rgba(48, 39, 34, 0.68), rgba(48, 39, 34, 0.12) 58%, transparent);
  z-index: 1;
}

#sectors .sector-content,
#sectors a.block.group.relative > .absolute.inset-0 {
  /* legibility gradient under light sector-card text (contrast fix 2026-06-12) */
  background: linear-gradient(to top, rgba(48, 39, 34, 0.68), rgba(48, 39, 34, 0.12) 62%) !important;
}

#sectors .sector-content {
  position: relative;
  z-index: 2;
}

#sectors a.block.group.relative > .absolute.bottom-0 {
  z-index: 2;
}

#sectors h3 {
  color: #fffaf4 !important;
  text-shadow: 0 2px 18px rgba(48, 39, 34, 0.42);
}

#sectors p.text-gray-300,
#sectors .sector-content p {
  color: rgba(255, 250, 244, 0.86) !important;
}

#sectors .sector-content a,
#sectors a.inline-block {
  color: #fffaf4 !important;
  background: rgba(82, 107, 80, 0.72) !important;
  border: 1px solid rgba(255, 250, 244, 0.22) !important;
  border-radius: 999px;
  padding: 0.55rem 0.85rem;
}

.journey-v2,
.local-trust-v2,
.showcase-v2 {
  background:
    radial-gradient(circle at 12% 12%, rgba(201, 130, 122, 0.12), transparent 28rem),
    radial-gradient(circle at 88% 10%, rgba(117, 141, 111, 0.14), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 56%, #eef3e8 100%) !important;
  border-color: var(--r3-line) !important;
}

.journey-v2 h2,
.local-trust-v2 h2,
.showcase-v2 h2,
.journey-card h3,
.local-trust-grid strong,
.showcase-card h3 {
  color: var(--r3-ink) !important;
  text-shadow: none !important;
}

.journey-eyebrow,
.local-trust-eyebrow,
.showcase-eyebrow,
.journey-card span,
.showcase-card span {
  color: var(--r3-clay) !important;
}

.journey-intro,
.journey-card p,
.local-trust-v2 p,
.local-trust-grid span,
.showcase-card p {
  color: var(--r3-muted) !important;
}

.journey-card,
.local-trust-grid div,
.showcase-card {
  background: rgba(255, 253, 248, 0.86) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: 0 18px 44px rgba(83, 60, 48, 0.10) !important;
}

@media (max-width: 860px) {
  .r3-demo-grid,
  .r3-icon-list {
    grid-template-columns: 1fr;
  }

  .r3-demo-board .r3-demo-row {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .r3-demo-pill {
    grid-column: 2;
    justify-self: start;
  }
}

/* Backend landing pages: override the older inline navy theme on solution and
   regional pages that load this brand layer after their page-local styles. */
.top + main,
main {
  background:
    radial-gradient(circle at 18% 8%, rgba(201, 130, 122, 0.12), transparent 30rem),
    radial-gradient(circle at 86% 18%, rgba(117, 141, 111, 0.14), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 58%, #eef3e8 100%) !important;
}

.hero {
  background:
    radial-gradient(circle at 14% 10%, rgba(201, 130, 122, 0.16), transparent 28rem),
    radial-gradient(circle at 86% 14%, rgba(117, 141, 111, 0.18), transparent 30rem),
    linear-gradient(180deg, #fffaf4 0%, #f7efe6 58%, #eef3e8 100%) !important;
  color: var(--r3-ink) !important;
  border-color: var(--r3-line) !important;
}

.hero h1,
.hero .lead,
.hero .eyebrow {
  text-shadow: none !important;
}

.hero h1 {
  color: var(--r3-ink) !important;
}

.hero .lead {
  color: var(--r3-muted) !important;
}

.hero .cta,
.final .cta,
.actions .cta {
  background: var(--r3-moss) !important;
  color: #fffaf4 !important;
  border: 1px solid rgba(82, 107, 80, 0.28) !important;
  box-shadow: 0 14px 34px rgba(82, 107, 80, 0.18) !important;
}

.hero .cta.secondary,
.final .cta.secondary,
.actions .cta.secondary {
  background: rgba(255, 253, 248, 0.74) !important;
  color: var(--r3-ink) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: 0 12px 28px rgba(83, 60, 48, 0.09) !important;
}

section:not(#sectors):not(#showroom):not(#calculator):not(#contact) {
  background: transparent !important;
  border-color: var(--r3-line) !important;
}

.grid {
  background: transparent !important;
  border: 1px solid var(--r3-line) !important;
  gap: 16px !important;
}

.card,
.panel,
.chip,
.r3-industry-demo,
.r3-visual-section {
  background: rgba(255, 253, 248, 0.86) !important;
  border-color: var(--r3-line) !important;
  color: var(--r3-ink) !important;
  box-shadow: 0 18px 44px rgba(83, 60, 48, 0.10) !important;
}

.card span,
.chip,
.r3-state-mark span {
  color: var(--r3-clay) !important;
}

.panel li,
.card p,
.footer,
.footer a {
  color: var(--r3-muted) !important;
}

#r3mc-btn {
  background: linear-gradient(135deg, var(--r3-clay), var(--r3-moss)) !important;
  color: #fffaf4 !important;
  box-shadow: 0 16px 42px rgba(82, 107, 80, 0.24) !important;
}

#r3mc-panel {
  background: linear-gradient(135deg, #fffdf8 0%, #f7efe6 100%) !important;
  color: var(--r3-ink) !important;
  border: 1px solid var(--r3-line) !important;
  box-shadow: 0 24px 70px rgba(83, 60, 48, 0.22) !important;
}

#r3mc-panel .r3mc-head,
#r3mc-form {
  background: rgba(255, 250, 244, 0.72) !important;
  border-color: var(--r3-line) !important;
}

#r3mc-panel .r3mc-head small,
#r3mc-close {
  color: var(--r3-muted) !important;
}

#r3mc-log .r3mc-bot {
  background: rgba(255, 250, 244, 0.88) !important;
  border: 1px solid var(--r3-line) !important;
  color: var(--r3-ink) !important;
}

#r3mc-log .r3mc-user {
  background: var(--r3-moss) !important;
  color: #fffaf4 !important;
}

#r3mc-input {
  background: #fffdf8 !important;
  color: var(--r3-ink) !important;
  border: 1px solid rgba(99, 75, 61, 0.20) !important;
}

#r3mc-form button {
  background: var(--r3-moss) !important;
  color: #fffaf4 !important;
}
