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

:root {
  --dfe-ink: #07131d;
  --dfe-ink-2: #0d2230;
  --dfe-panel: #102b3a;
  --dfe-green: #62d38b;
  --dfe-green-deep: #16864b;
  --dfe-cyan: #66d8e7;
  --dfe-sand: #f2f5f3;
  --dfe-white: #ffffff;
  --dfe-text: #243641;
  --dfe-muted: #5a6c77;
  --dfe-line: #d8e1e5;
  --dfe-gold: #e8b35b;
  --dfe-radius: 1.2rem;
  --dfe-shadow: 0 22px 70px rgba(7, 19, 29, .12);
}

html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--dfe-text);
  background: #fff;
  font-size: 17px;
  line-height: 1.65;
  letter-spacing: .02em;
}
body * { letter-spacing: inherit; }
h1,h2,h3,h4,h5,h6 {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--dfe-ink);
  font-weight: 780;
  line-height: 1.08;
}
h1 { font-size: clamp(2.75rem, 6vw, 5.5rem); }
h2 { font-size: clamp(2.05rem, 4vw, 3.6rem); }
h3 { font-size: clamp(1.32rem, 2.2vw, 1.72rem); }
p { color: var(--dfe-muted); }
a { color: var(--dfe-green-deep); }
a:hover { color: #0f6939; }

.navbar {
  background: rgba(7, 19, 29, .97);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(14px);
}
.navbar-brand {
  color: #fff !important;
  font-weight: 860;
  letter-spacing: .08em !important;
}
.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-right: .55rem;
  border-radius: .6rem;
  border: 1px solid rgba(255,255,255,.22);
  background: linear-gradient(145deg, rgba(98,211,139,.24), rgba(102,216,231,.08));
}
.nav-link { color: #c9d4da !important; font-size: .93rem; font-weight: 670; }
.nav-link:hover,.nav-link.active { color: #fff !important; }
.navbar-toggler {
  border-color: rgba(126,197,240,.26);
  background: rgba(255,255,255,.03);
  color: #d9eaf4;
}
.navbar-toggler:hover {
  background: rgba(43,138,212,.12);
  border-color: rgba(126,197,240,.42);
}
.navbar-toggler:focus {
  box-shadow: 0 0 0 .18rem rgba(43,138,212,.22);
}
.navbar-toggler-icon {
  filter: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28217,234,244,0.98%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
  background-size: 1.5rem 1.5rem;
}
.dropdown-menu-dark { background: #0b1b26; border-color: rgba(255,255,255,.1); }

.btn {
  border-radius: .82rem;
  padding: .78rem 1.12rem;
  font-weight: 760;
  letter-spacing: .03em;
}
.btn-dfe { background: var(--dfe-green); color: #06120c; border: 1px solid var(--dfe-green); }
.btn-dfe:hover { background: #7cdf9e; border-color: #7cdf9e; color: #06120c; }
.btn-outline-dfe { color: #fff; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.03); }
.btn-outline-dfe:hover { color: #fff; background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.48); }
.btn-outline-ink { color: var(--dfe-ink); border: 1px solid #9baab2; }
.btn-outline-ink:hover { color: var(--dfe-ink); background: #eef3f4; border-color: #73858e; }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  color: var(--dfe-green-deep);
  font-size: .78rem;
  font-weight: 860;
  text-transform: uppercase;
  letter-spacing: .12em !important;
  margin-bottom: 1rem;
}
.eyebrow::before { content: ''; width: 22px; height: 2px; background: currentColor; }
.eyebrow.light { color: var(--dfe-green); }

.hero {
  position: relative;
  background:
    radial-gradient(circle at 84% 18%, rgba(102,216,231,.18), transparent 29%),
    radial-gradient(circle at 18% 82%, rgba(98,211,139,.15), transparent 27%),
    linear-gradient(145deg, #07131d 0%, #0a1c28 56%, #0e2b3a 100%);
  overflow: hidden;
  padding: 8.8rem 0 5.8rem;
}
.hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.034) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.034) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.7), transparent);
  pointer-events: none;
}
.hero .container { position: relative; z-index: 2; }
.hero h1 { color: #fff; max-width: 1000px; }
.hero .lead { color: #c4d1d8; font-size: clamp(1.13rem, 2vw, 1.38rem); max-width: 800px; }
.hero-kicker {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .55rem;
  color: #bdcbd2;
  font-weight: 750;
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .1em !important;
}
.hero-kicker .dot { width: 7px; height: 7px; background: var(--dfe-green); border-radius: 50%; box-shadow: 0 0 0 5px rgba(98,211,139,.12); }

.page-hero {
  background:
    radial-gradient(circle at 85% 20%, rgba(102,216,231,.13), transparent 26%),
    linear-gradient(145deg, #07131d, #0d2634);
  padding: 8rem 0 4.5rem;
}
.page-hero h1 { color: #fff; max-width: 980px; }
.page-hero .lead { color: #c7d3d9; max-width: 820px; font-size: 1.24rem; }
.page-hero .row.align-items-center{align-items:flex-start !important;}

.signal-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 1.3rem;
  padding: 1.1rem;
  box-shadow: 0 30px 80px rgba(0,0,0,.28);
}
.signal-screen { background: #061017; border: 1px solid rgba(255,255,255,.08); border-radius: 1rem; padding: 1rem; }
.signal-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }
.metric { background: #0d1d27; border: 1px solid rgba(255,255,255,.07); border-radius: .85rem; padding: .9rem; }
.metric-label { font-size: .69rem; color: #8fa3ad; text-transform: uppercase; font-weight: 820; letter-spacing: .09em !important; }
.metric-value { color: #fff; font-weight: 860; font-size: 1.62rem; line-height: 1.2; }
.metric-value small { color: #91a4ae; font-size: .72rem; font-weight: 700; }
.spark {
  height: 78px;
  margin-top: .9rem;
  border-radius: .75rem;
  background:
    linear-gradient(135deg, transparent 0 28%, rgba(98,211,139,.95) 29% 31%, transparent 32% 43%, rgba(98,211,139,.95) 44% 46%, transparent 47% 57%, rgba(102,216,231,.9) 58% 60%, transparent 61%),
    linear-gradient(180deg, rgba(98,211,139,.09), transparent);
  border: 1px solid rgba(255,255,255,.06);
}

.section { padding: 5.5rem 0; }
.section-sm { padding: 3.3rem 0; }
.bg-soft { background: var(--dfe-sand); }
.bg-ink { background: var(--dfe-ink); }
.bg-panel { background: #0d2230; }
.text-white p,.text-white .lead { color: #c8d6dc; }

.problem-card,.product-card,.info-card,.form-shell {
  height: 100%;
  background: #fff;
  border: 1px solid var(--dfe-line);
  border-radius: var(--dfe-radius);
  padding: 1.65rem;
  box-shadow: 0 10px 35px rgba(7,19,29,.06);
}
.problem-card,.product-card { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.problem-card:hover,.product-card:hover { transform: translateY(-4px); box-shadow: var(--dfe-shadow); border-color: #bccbd1; }
.icon-box {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: .85rem;
  background: #eaf7ef;
  color: #13844a;
  font-size: 1.15rem;
  margin-bottom: 1.1rem;
}
.icon-box.blue { background: #e8f7fa; color: #177d8d; }
.icon-box.gold { background: #fff5df; color: #956514; }
.card-link { font-weight: 820; text-decoration: none; }

.stat-band {
  background: linear-gradient(135deg, #0c2230, #102d3d);
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.stat { padding: 1.45rem 0; }
.stat strong { display: block; color: #fff; font-size: 1.6rem; }
.stat span { color: #9fb1ba; font-size: .86rem; }

.callout {
  border-left: 4px solid var(--dfe-green);
  background: #edf8f1;
  border-radius: 0 1rem 1rem 0;
  padding: 1.25rem 1.35rem;
}
.callout p:last-child { margin-bottom: 0; }

.check-list { list-style: none; padding: 0; margin: 0; }
.check-list li { position: relative; padding-left: 1.8rem; margin: .68rem 0; color: var(--dfe-muted); }
.check-list li::before { content: '\2713'; position: absolute; left: 0; top: .05rem; font-weight: 900; color: var(--dfe-green-deep); }
.check-list.light li { color: #c6d3d9; }
.check-list.light li::before { color: var(--dfe-green); }

.product-strip { border-radius: 1.25rem; padding: 1.3rem; background: #0d2230; border: 1px solid rgba(255,255,255,.08); }
.product-strip h3,.product-strip h4 { color: #fff; }
.product-strip p { color: #a9bbc4; }

.step-number {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--dfe-ink);
  color: #fff;
  font-weight: 860;
  margin-bottom: 1rem;
}
.quote-card { border-radius: 1.25rem; background: #0d2230; padding: 1.8rem; border: 1px solid rgba(255,255,255,.08); }
.quote-card blockquote { color: #eaf0f2; font-size: 1.25rem; margin: 0; }
.quote-card small { color: #91a6b0; }

.form-shell { padding: clamp(1.4rem, 3vw, 2.2rem); }
.form-label { font-weight: 760; color: var(--dfe-ink); font-size: .9rem; }
.form-control,.form-select { border-color: #bdc9cf; border-radius: .75rem; padding: .78rem .9rem; font-size: 1rem; letter-spacing: .02em; }
.form-control:focus,.form-select:focus { border-color: #36ac69; box-shadow: 0 0 0 .2rem rgba(54,172,105,.13); }
.form-note { font-size: .82rem; color: #6a7b84; }
.required::after { content: ' *'; color: #b04a4a; }

.badge-dfe {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  background: #eaf7ef;
  color: #177846;
  border: 1px solid #ccebd8;
  border-radius: 999px;
  padding: .4rem .7rem;
  font-weight: 820;
  font-size: .74rem;
}
.badge-dark-dfe { background: rgba(98,211,139,.11); color: #94e3ad; border: 1px solid rgba(98,211,139,.2); }

.table-dfe { --bs-table-bg: transparent; }
.table-dfe th { color: var(--dfe-ink); font-size: .82rem; text-transform: uppercase; letter-spacing: .08em !important; }
.table-dfe td,.table-dfe th { border-color: #dce4e7; padding: 1rem .75rem; }
.table-dfe td { color: #53656f; }

.anchor-nav { border-bottom: 1px solid var(--dfe-line); background: #fff; position: sticky; top: 72px; z-index: 10; }
.anchor-nav a { display: inline-block; padding: 1rem .8rem; color: #52636d; text-decoration: none; font-weight: 760; font-size: .88rem; }
.anchor-nav a:hover { color: var(--dfe-ink); }

.cta-band {
  background: linear-gradient(135deg, #0a1a25, #0f3140);
  border-radius: 1.5rem;
  padding: clamp(1.6rem, 4vw, 3rem);
  border: 1px solid rgba(255,255,255,.08);
}
.cta-band h2,.cta-band h3 { color: #fff; }
.cta-band p { color: #b8c8d0; }

.pill-row { display: flex; flex-wrap: wrap; gap: .55rem; }
.pill { display: inline-flex; align-items: center; gap: .4rem; background: #eef4f5; color: #334b58; border: 1px solid #d9e2e6; border-radius: 999px; padding: .52rem .76rem; font-size: .8rem; font-weight: 760; }
.pill.dark { background: rgba(255,255,255,.05); color: #c8d4da; border-color: rgba(255,255,255,.1); }

footer { background: #061017; color: #98abb4; padding: 4rem 0 2rem; }
footer h5 { color: #fff; font-size: .9rem; text-transform: uppercase; letter-spacing: .08em !important; }
footer p { color: #98abb4; }
footer a { color: #a9bbc4; text-decoration: none; }
footer a:hover { color: #fff; }
.footer-brand { color: #fff; font-weight: 860; letter-spacing: .08em !important; }
.footer-rule { border-color: rgba(255,255,255,.09); }
.tiny { font-size: .78rem; }
.smallcaps { font-size: .77rem; text-transform: uppercase; font-weight: 860; letter-spacing: .1em !important; }
hr { border-color: #dce3e6; opacity: 1; }

@media (max-width: 991.98px) {
  .hero { padding-top: 7.5rem; }
  .hero h1 { font-size: clamp(2.6rem, 9vw, 4.7rem); }
  .anchor-nav { position: static; overflow-x: auto; white-space: nowrap; }
}
@media (max-width: 575.98px) {
  body { font-size: 16px; }
  .section { padding: 4rem 0; }
  .hero { padding-bottom: 4.5rem; }
  .signal-grid { grid-template-columns: 1fr; }
  .hero .d-flex.gap-3,.page-hero .d-flex.gap-3 { flex-direction: column; }
  .btn-lg { width: 100%; }
}

.article-wrap h2 { margin-top: 2.4rem; margin-bottom: 1rem; }
.article-wrap h2:first-child { margin-top: 0; }
.article-wrap h3 { margin-top: 1.7rem; }
.article-wrap p, .article-wrap li { max-width: 78ch; }
.article-list { color: var(--dfe-muted); padding-left: 1.35rem; }
.article-list li { margin: .75rem 0; padding-left: .35rem; }
.resource-aside { top: 105px; }
@media (max-width: 991.98px) { .resource-aside { position: static !important; } }


/* ==========================================================
   DFELAB BRAND SYSTEM V4
   Blue is the primary brand/action color. Green is reserved
   for telemetry, online state, healthy/success conditions.
   ========================================================== */
:root {
  --dfe-blue: #1474bd;
  --dfe-blue-bright: #2b8ad4;
  --dfe-blue-deep: #07538d;
  --dfe-blue-soft: #eaf4fb;
  --dfe-blue-line: #c6dfee;
  --dfe-ink: #061725;
  --dfe-ink-2: #0a2235;
  --dfe-panel: #0d2b42;
  --dfe-green: #57c985;
  --dfe-green-deep: #18864a;
  --dfe-cyan: #65cce7;
  --dfe-sand: #f4f7f9;
  --dfe-text: #273b49;
  --dfe-muted: #5a6c77;
  --dfe-line: #d8e2e8;
  --dfe-gold: #e8b35b;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
h1,h2,h3,h4,h5,h6,
.navbar-brand,.nav-link,.btn,.eyebrow,.smallcaps,.metric-value,.stat strong {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

a { color: var(--dfe-blue-deep); }
a:hover { color: #063f6d; }

.navbar {
  background: rgba(5, 22, 35, .975);
  border-bottom-color: rgba(93, 167, 220, .18);
}
.brand-mark {
  background: linear-gradient(145deg, rgba(43,138,212,.48), rgba(20,116,189,.16));
  border-color: rgba(110,187,239,.34);
  box-shadow: 0 0 0 5px rgba(20,116,189,.08);
}
.nav-link:hover,.nav-link.active { color: #79c1f3 !important; }

.btn-dfe {
  background: var(--dfe-blue);
  color: #fff;
  border-color: var(--dfe-blue);
  box-shadow: 0 10px 26px rgba(20,116,189,.18);
}
.btn-dfe:hover {
  background: var(--dfe-blue-bright);
  border-color: var(--dfe-blue-bright);
  color: #fff;
}
.btn-outline-ink:hover { border-color: var(--dfe-blue); background: var(--dfe-blue-soft); }

.eyebrow { color: var(--dfe-blue-deep); }
.eyebrow.light { color: #78c4f5; }
.hero {
  background:
    radial-gradient(circle at 83% 18%, rgba(43,138,212,.26), transparent 30%),
    radial-gradient(circle at 18% 82%, rgba(87,201,133,.08), transparent 26%),
    linear-gradient(145deg, #051623 0%, #082237 56%, #0a3350 100%);
}
.page-hero {
  background:
    radial-gradient(circle at 85% 20%, rgba(43,138,212,.23), transparent 28%),
    radial-gradient(circle at 14% 86%, rgba(87,201,133,.06), transparent 24%),
    linear-gradient(145deg, #051623, #0a304b);
}
.hero-kicker .dot { background: var(--dfe-blue-bright); box-shadow: 0 0 0 5px rgba(43,138,212,.14); }
.stat-band { background: linear-gradient(135deg, #082238, #0b3653); }
.bg-ink { background: #061725; }
.bg-panel,.product-strip,.quote-card { background: #0a2940; }
.cta-band { background: linear-gradient(135deg, #061b2b, #0b3c5c); }

.icon-box {
  background: var(--dfe-blue-soft);
  color: var(--dfe-blue-deep);
}
.icon-box.blue { background: #e8f5fc; color: #0d75ac; }
.icon-box.green { background: #eaf8ef; color: var(--dfe-green-deep); }
.card-link { color: var(--dfe-blue-deep); }
.form-control:focus,.form-select:focus { border-color: var(--dfe-blue); box-shadow: 0 0 0 .2rem rgba(20,116,189,.13); }
.anchor-nav a:hover { color: var(--dfe-blue-deep); }
.callout { border-left-color: var(--dfe-blue); background: #edf6fc; }

/* Green remains meaningful: healthy/online/status, never the dominant brand CTA. */
.badge-dfe { background: #eaf8ef; color: #177846; border-color: #ccebd8; }
.badge-dark-dfe { background: rgba(87,201,133,.11); color: #96e2b1; border-color: rgba(87,201,133,.2); }
.check-list li::before,.check-list.light li::before { color: var(--dfe-green-deep); }

/* ==========================================================
   R3CON LIVE PRODUCT DEMOS
   Native SVG charts keep the marketing site lightweight.
   ========================================================== */
.dfe-live-demo {
  --demo-bg: #061522;
  --demo-panel: #0a2234;
  --demo-panel-2: #0d2b42;
  --demo-line: rgba(167,202,225,.14);
  --demo-text: #eef7fc;
  --demo-muted: #8fa8b8;
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 1.35rem;
  border: 1px solid rgba(120,191,239,.18);
  background:
    radial-gradient(circle at 85% 8%, rgba(43,138,212,.16), transparent 30%),
    linear-gradient(155deg, #061522, #071c2b 55%, #08243a);
  box-shadow: 0 26px 70px rgba(0,0,0,.24);
  color: var(--demo-text);
  padding: 1rem;
}
.dfe-live-demo * { box-sizing: border-box; }
.demo-topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .85rem;
}
.demo-product { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.demo-product-mark {
  width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center;
  border-radius: .72rem; background: linear-gradient(145deg,var(--dfe-blue-bright),var(--dfe-blue-deep));
  color: white; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 800; box-shadow: 0 8px 24px rgba(20,116,189,.22);
}
.demo-title { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: #fff; font-size: .9rem; font-weight: 750; line-height: 1.1; }
.demo-subtitle { color: var(--demo-muted); font-size: .7rem; margin-top: .18rem; }
.demo-toolbar { display: flex; align-items: center; justify-content: flex-end; gap: .45rem; flex-wrap: wrap; }
.demo-badge {
  display: inline-flex; align-items: center; gap: .35rem; border-radius: 999px; padding: .34rem .58rem;
  border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.04); color: #bed0db;
  font-size: .62rem; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 750; letter-spacing: .06em !important; text-transform: uppercase;
}
.demo-badge.demo-live { color: #9be5b5; border-color: rgba(87,201,133,.24); background: rgba(87,201,133,.08); }
.demo-badge.demo-watch { color: #f4ca82; border-color: rgba(232,179,91,.28); background: rgba(232,179,91,.08); }
.demo-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--dfe-green); box-shadow: 0 0 0 4px rgba(87,201,133,.1); }
.demo-watch .demo-dot { background: var(--dfe-gold); box-shadow: 0 0 0 4px rgba(232,179,91,.1); }
.demo-pause {
  border: 1px solid rgba(255,255,255,.13); background: rgba(255,255,255,.04); color: #b8cad4; border-radius: .6rem;
  padding: .32rem .48rem; font-size: .67rem; line-height: 1; cursor: pointer;
}
.demo-pause:hover { background: rgba(255,255,255,.08); color: white; }
.demo-tabs { display: flex; gap: .38rem; margin-bottom: .8rem; padding: .25rem; border-radius: .75rem; background: rgba(0,0,0,.16); }
.demo-tab {
  flex: 1 1 0; border: 0; border-radius: .58rem; background: transparent; color: #91a8b6; padding: .5rem .6rem;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: .68rem; font-weight: 720; cursor: pointer;
}
.demo-tab.active { background: rgba(43,138,212,.18); color: #dff3ff; box-shadow: inset 0 0 0 1px rgba(87,164,219,.2); }
.demo-pane[hidden] { display: none !important; }
.demo-stats { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .55rem; }
.demo-stat {
  min-width: 0; padding: .72rem .72rem .66rem; border-radius: .82rem; background: rgba(10,34,52,.88);
  border: 1px solid rgba(255,255,255,.07); box-shadow: inset 0 1px 0 rgba(255,255,255,.018);
}
.demo-stat-label {
  color: #829bab; font-size: .59rem; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 720;
  text-transform: uppercase; letter-spacing: .07em !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.demo-stat-value {
  margin-top: .2rem; color: #fff; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 1.16rem; font-weight: 760; line-height: 1.1;
  font-variant-numeric: tabular-nums;
}
.demo-stat-value small { color: #91a8b6; font-size: .57rem; font-weight: 650; }
.demo-stat-meta { color: #6f8999; font-size: .58rem; margin-top: .18rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.demo-stat.status-good .demo-stat-value { color: #9be5b5; }
.demo-stat.status-watch .demo-stat-value { color: #f0c67b; }
.demo-chart-panel {
  margin-top: .58rem; padding: .72rem .72rem .55rem; border-radius: .86rem; background: rgba(5,18,28,.58);
  border: 1px solid rgba(255,255,255,.065);
}
.demo-chart-head { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-bottom: .3rem; }
.demo-chart-title { color: #d9e8f0; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-weight: 700; font-size: .67rem; }
.demo-chart-meta { color: #718b9a; font-size: .57rem; }
.demo-chart { width: 100%; height: 122px; display: block; overflow: visible; }
.demo-chart.compact { height: 82px; }
.demo-chart .grid { stroke: rgba(178,206,224,.085); stroke-width: 1; }
.demo-chart .axis-label { fill: #678292; font: 9px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.demo-chart .line-blue { fill: none; stroke: var(--dfe-blue-bright); stroke-width: 2.3; vector-effect: non-scaling-stroke; }
.demo-chart .line-green { fill: none; stroke: var(--dfe-green); stroke-width: 2.0; vector-effect: non-scaling-stroke; }
.demo-chart .line-cyan { fill: none; stroke: var(--dfe-cyan); stroke-width: 1.8; vector-effect: non-scaling-stroke; }
.demo-chart .line-gold { fill: none; stroke: var(--dfe-gold); stroke-width: 1.9; vector-effect: non-scaling-stroke; }
.demo-chart .area-blue { fill: url(#dfeBlueFill); opacity: .48; }
.demo-chart .threshold { stroke: #e26868; stroke-width: 1.25; stroke-dasharray: 6 5; vector-effect: non-scaling-stroke; }
.demo-chart .threshold-label { fill: #e58b8b; font: 9px 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.demo-chart .bar { fill: rgba(43,138,212,.82); }
.demo-chart .bar-latest { fill: rgba(87,201,133,.92); }
.demo-health { display: grid; grid-template-columns: repeat(24, minmax(0,1fr)); gap: 2px; align-items: end; height: 52px; padding-top: .35rem; }
.demo-health span { display: block; height: 19px; border-radius: 3px 3px 1px 1px; background: rgba(87,201,133,.72); border: 1px solid rgba(87,201,133,.2); }
.demo-health span.late { height: 36px; background: rgba(225,91,91,.78); border-color: rgba(225,91,91,.22); }
.demo-health span.latest { background: #75dfa0; box-shadow: 0 0 14px rgba(87,201,133,.18); }
.demo-legend { display: flex; gap: .7rem; flex-wrap: wrap; color: #7893a2; font-size: .58rem; margin-top: .35rem; }
.demo-legend span { display: inline-flex; align-items: center; gap: .3rem; }
.demo-legend i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
.demo-foot {
  display: flex; justify-content: space-between; gap: .7rem; flex-wrap: wrap; margin-top: .65rem; padding-top: .62rem;
  border-top: 1px solid rgba(255,255,255,.07); color: #6f8999; font-size: .58rem;
}
.demo-foot strong { color: #9fb4c0; font-weight: 650; }
.demo-disclaimer { color: #6c8492; }
.demo-updated { font-variant-numeric: tabular-nums; }
.demo-compact .demo-chart { height: 100px; }
.demo-hero { min-height: 438px; display: flex; flex-direction: column; justify-content: center; }

@media (max-width: 575.98px) {
  .dfe-live-demo { padding: .82rem; }
  .demo-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .demo-topbar { flex-direction: column; }
  .demo-toolbar { justify-content: flex-start; }
  .demo-hero { min-height: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .dfe-live-demo * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}


/* ==========================================================
   ALERT WORKFLOW TERMINAL
   Animated backend event visualization for use-case pages.
   ========================================================== */
.alert-workflow-copy .eyebrow { margin-bottom: .75rem; }
.alert-workflow-copy .lead { max-width: 37rem; }
.alert-workflow-steps {
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .6rem; margin-top: 1.35rem;
}
.alert-workflow-step {
  padding: .82rem .88rem; border-radius: .85rem; background: #fff; border: 1px solid var(--dfe-line);
}
.bg-ink .alert-workflow-step { background: rgba(255,255,255,.045); border-color: rgba(255,255,255,.09); }
.alert-workflow-step strong { display: block; font: 750 .78rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: var(--dfe-ink); }
.bg-ink .alert-workflow-step strong { color: #fff; }
.alert-workflow-step span { display: block; margin-top: .2rem; color: #71818b; font-size: .72rem; line-height: 1.35; }
.bg-ink .alert-workflow-step span { color: #92a8b5; }

.alert-terminal-shell {
  overflow: hidden; border-radius: 1.1rem; border: 1px solid rgba(103,174,222,.2);
  background: #04111b; box-shadow: 0 26px 70px rgba(0,0,0,.25); color: #dceaf2;
}
.alert-terminal-topbar {
  min-height: 54px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: .85rem;
  padding: .65rem .85rem; background: linear-gradient(180deg,#0b2638,#081d2c); border-bottom: 1px solid rgba(255,255,255,.08);
}
.alert-terminal-lights { display: flex; gap: .32rem; }
.alert-terminal-lights span { width: 9px; height: 9px; border-radius: 50%; background: #23445a; }
.alert-terminal-lights span:nth-child(1) { background:#df6666; }
.alert-terminal-lights span:nth-child(2) { background:#e8b35b; }
.alert-terminal-lights span:nth-child(3) { background:#57c985; }
.alert-terminal-title { min-width: 0; }
.alert-terminal-title strong { display:block; color:#eff8fc; font: 750 .75rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.alert-terminal-title small { display:block; margin-top:.08rem; color:#7390a2; font-size:.61rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.alert-terminal-state {
  display:inline-flex; align-items:center; gap:.38rem; padding:.34rem .55rem; border:1px solid rgba(255,255,255,.1);
  border-radius:999px; background:rgba(255,255,255,.035); color:#99afbb; font:700 .58rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  text-transform:uppercase; letter-spacing:.055em !important; white-space:nowrap; transition:.2s ease;
}
.alert-terminal-state span { width:7px; height:7px; border-radius:50%; background:#57c985; box-shadow:0 0 0 4px rgba(87,201,133,.09); }
.alert-terminal-state.state-receiving { color:#8fd1f5; border-color:rgba(43,138,212,.25); background:rgba(43,138,212,.08); }
.alert-terminal-state.state-receiving span,.alert-terminal-state.state-checking span { background:#2b8ad4; box-shadow:0 0 0 4px rgba(43,138,212,.1); }
.alert-terminal-state.state-checking { color:#a9d8f3; border-color:rgba(43,138,212,.25); }
.alert-terminal-state.state-alert { color:#ffaaaa; border-color:rgba(223,102,102,.38); background:rgba(223,102,102,.12); }
.alert-terminal-state.state-alert span { background:#df6666; box-shadow:0 0 0 4px rgba(223,102,102,.13); animation:terminalAlertPulse .8s infinite alternate; }
.alert-terminal-state.state-notifying { color:#f3cf91; border-color:rgba(232,179,91,.3); background:rgba(232,179,91,.08); }
.alert-terminal-state.state-notifying span { background:#e8b35b; box-shadow:0 0 0 4px rgba(232,179,91,.1); }
.alert-terminal-state.state-complete { color:#a7e6bb; border-color:rgba(87,201,133,.28); background:rgba(87,201,133,.08); }

.alert-terminal-stage { padding: .85rem .9rem .7rem; }
.alert-terminal-label {
  display:flex; align-items:center; gap:.42rem; color:#638397; font:700 .59rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  text-transform:uppercase; letter-spacing:.07em !important; margin-bottom:.65rem;
}
.alert-terminal-output {
  height: 276px; overflow-y: auto; overscroll-behavior: contain; padding: .25rem .15rem .3rem;
  scrollbar-width: thin; scrollbar-color: #173d55 transparent;
}
.alert-terminal-line {
  display:grid; grid-template-columns: 62px 18px minmax(0,1fr); gap:.42rem; align-items:start;
  padding:.34rem .3rem; border-radius:.34rem; opacity:0; transform:translateY(4px); transition:opacity .18s ease,transform .18s ease;
  font: 500 .69rem/1.5 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
}
.alert-terminal-line.is-visible { opacity:1; transform:translateY(0); }
.alert-terminal-line:hover { background:rgba(255,255,255,.025); }
.terminal-time { color:#4e7187; font-variant-numeric:tabular-nums; }
.terminal-icon { color:#55788e; text-align:center; }
.terminal-text { color:#9eb7c6; overflow-wrap:anywhere; }
.terminal-rx .terminal-icon,.terminal-rx .terminal-text { color:#72bceb; }
.terminal-data .terminal-text { color:#a8c4d4; }
.terminal-calc .terminal-icon { color:#65cce7; }
.terminal-rule { background:rgba(43,138,212,.045); }
.terminal-rule .terminal-icon,.terminal-rule .terminal-text { color:#8ecff5; }
.terminal-alert { background:linear-gradient(90deg,rgba(223,102,102,.15),rgba(223,102,102,.035)); box-shadow:inset 3px 0 0 #df6666; }
.terminal-alert .terminal-icon,.terminal-alert .terminal-text { color:#ffaaa5; font-weight:700; }
.terminal-notify .terminal-icon { color:#e8b35b; }
.terminal-notify .terminal-text { color:#e8ca98; }
.terminal-ok { background:rgba(87,201,133,.055); }
.terminal-ok .terminal-icon,.terminal-ok .terminal-text { color:#8bdda7; }
.alert-terminal-cursor {
  color:#6e8b9c; font:500 .67rem ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  padding:.35rem .3rem 0;
}
.alert-terminal-cursor span { color:#6fb3de; }
.alert-terminal-cursor i { display:inline-block; width:7px; height:1em; vertical-align:-2px; background:#88c9f0; animation:terminalCursor 1s steps(1,end) infinite; }
.alert-terminal-footer {
  display:flex; justify-content:space-between; align-items:center; gap:.8rem; flex-wrap:wrap; padding:.62rem .85rem;
  background:#061722; border-top:1px solid rgba(255,255,255,.07); color:#617f91; font-size:.59rem;
}
.alert-terminal-footer > span { display:flex; align-items:center; gap:.4rem; }
.alert-terminal-replay {
  border:1px solid rgba(101,204,231,.18); background:rgba(43,138,212,.08); color:#8ecbf0; border-radius:.55rem;
  padding:.34rem .52rem; font:700 .58rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; cursor:pointer;
}
.alert-terminal-replay:hover { background:rgba(43,138,212,.14); color:#dff3ff; }
@keyframes terminalCursor { 0%,48%{opacity:1} 49%,100%{opacity:0} }
@keyframes terminalAlertPulse { from{transform:scale(.9);opacity:.75} to{transform:scale(1.1);opacity:1} }

@media (max-width: 767.98px) {
  .alert-workflow-steps { grid-template-columns:1fr; }
  .alert-terminal-topbar { grid-template-columns:auto minmax(0,1fr); }
  .alert-terminal-state { grid-column:1/-1; justify-self:start; }
  .alert-terminal-output { height:300px; }
  .alert-terminal-line { grid-template-columns:52px 16px minmax(0,1fr); font-size:.61rem; gap:.3rem; }
}
@media (prefers-reduced-motion: reduce) {
  .alert-terminal-line { transition:none; }
  .alert-terminal-state.state-alert span,.alert-terminal-cursor i { animation:none; }
}


/* ==========================================================
   Interactive R3CON field + alert simulator
   ========================================================== */
.demo-badge.demo-alert { color:#ffb5b0; border-color:rgba(223,102,102,.38); background:rgba(223,102,102,.12); }
.demo-badge.demo-alert .demo-dot { background:#df6666; box-shadow:0 0 0 4px rgba(223,102,102,.12); }
.r3-simulator { border:1px solid #c9d7df; border-radius:1.35rem; overflow:hidden; background:#fff; box-shadow:0 26px 70px rgba(7,37,60,.11); }
.sim-head { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.2rem 1.25rem; background:linear-gradient(135deg,#edf6fc,#f8fbfd); border-bottom:1px solid #d7e3e9; }
.sim-head-title { display:flex; align-items:center; gap:.9rem; min-width:0; }
.sim-head-title h3 { margin:.08rem 0 0; font-size:1.2rem; }
.sim-head-title p { margin:.25rem 0 0; font-size:.82rem; color:#637783; }
.sim-product-mark { flex:0 0 auto; width:44px; height:44px; border-radius:.8rem; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,var(--dfe-blue),var(--dfe-blue-deep)); box-shadow:0 10px 25px rgba(20,116,189,.22); }
.sim-head-badges { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.45rem; }
.sim-grid { display:grid; grid-template-columns:minmax(300px, .78fr) minmax(0,1.5fr); min-height:600px; }
.sim-controls-panel { padding:1.15rem; border-right:1px solid #dbe5ea; background:#fbfcfd; }
.sim-panel-label { display:flex; align-items:center; gap:.45rem; margin-bottom:1rem; color:#49606d; font:750 .74rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; text-transform:uppercase; letter-spacing:.08em !important; }
.sim-controls { display:grid; gap:1rem; }
.sim-control { padding-bottom:.9rem; border-bottom:1px solid #e2eaee; }
.sim-control-head { display:flex; justify-content:space-between; align-items:center; gap:.8rem; margin-bottom:.45rem; }
.sim-control-head label,.sim-control-label { margin:0; color:#183546; font:700 .82rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.sim-control-head output { min-width:92px; text-align:right; color:var(--dfe-blue-deep); font:800 .82rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-variant-numeric:tabular-nums; }
.sim-range { accent-color:var(--dfe-blue); }
.sim-control-help { margin-top:.25rem; color:#748691; font-size:.69rem; line-height:1.45; }
.sim-number-control .input-group { margin-top:.48rem; }
.sim-number-control .input-group-text { color:#49606d; background:#eff4f6; border-color:#c6d3d9; font-size:.72rem; }
.sim-hysteresis,.sim-hour-card { padding:.75rem .8rem; border-radius:.8rem; background:#eef6fb; border:1px solid #cfe2ef; }
.sim-hysteresis span,.sim-hour-card span { display:block; color:#58707d; font-size:.66rem; text-transform:uppercase; font-weight:800; letter-spacing:.07em !important; }
.sim-hysteresis strong,.sim-hour-card strong { display:block; margin:.12rem 0; color:#0a5f99; font-size:1.05rem; }
.sim-hysteresis small,.sim-hour-card small { display:block; color:#6c7f89; font-size:.66rem; line-height:1.4; }
.sim-presets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.45rem; margin:1rem 0; }
.sim-preset { min-height:56px; border:1px solid #cbd8de; border-radius:.72rem; background:#fff; color:#536a76; font:700 .67rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; padding:.45rem; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.25rem; transition:.15s ease; }
.sim-preset i { font-size:.9rem; }
.sim-preset:hover,.sim-preset.active { border-color:#75b4dc; color:#07538d; background:#edf7fd; }
.sim-state-card { margin:0 0 1rem; padding:.8rem .85rem; border-radius:.8rem; border:1px solid #cfe1d5; background:#f0f9f3; }
.sim-state-card > div { display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.sim-state-card span { color:#637882; font-size:.68rem; font-weight:800; text-transform:uppercase; }
.sim-state-card strong { color:#218d50; font:850 .76rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; letter-spacing:.07em !important; }
.sim-state-card small { display:block; margin-top:.25rem; color:#6f8189; font-size:.68rem; }
.sim-state-card.state-active { border-color:#ecc1be; background:#fff2f1; }
.sim-state-card.state-active strong { color:#c64e48; }
.sim-state-card.state-recovered { border-color:#c6dced; background:#f0f7fc; }
.sim-state-card.state-recovered strong { color:#1474bd; }
.sim-send:disabled { opacity:.65; cursor:wait; }
.sim-disclaimer { display:flex; gap:.4rem; align-items:flex-start; margin-top:.75rem; color:#7a8c95; font-size:.65rem; line-height:1.45; }
.sim-runtime { min-width:0; padding:1.1rem; background:linear-gradient(180deg,#0b1d2a,#07131d); }
.sim-pipeline { display:grid; grid-template-columns:auto 1fr auto 1fr auto 1fr auto 1fr auto; align-items:center; margin:.15rem 0 1rem; }
.sim-stage { min-width:76px; text-align:center; opacity:.52; transition:.25s ease; }
.sim-stage > span { width:38px; height:38px; margin:0 auto .35rem; border-radius:50%; display:grid; place-items:center; background:#132e3f; border:1px solid rgba(255,255,255,.11); color:#7195aa; transition:.25s ease; }
.sim-stage b { display:block; color:#9fb4c0; font:700 .64rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; white-space:nowrap; }
.sim-stage small { display:block; color:#557386; font-size:.52rem; white-space:nowrap; }
.sim-stage.active { opacity:1; transform:translateY(-2px); }
.sim-stage.active > span { color:#fff; background:rgba(43,138,212,.35); border-color:#4fa8df; box-shadow:0 0 0 6px rgba(43,138,212,.09); }
.sim-stage.done { opacity:.9; }
.sim-stage.done > span { color:#9ce4b3; background:rgba(87,201,133,.14); border-color:rgba(87,201,133,.36); }
.sim-stage.alerted > span { color:#ffc1bc; background:rgba(223,102,102,.19); border-color:rgba(223,102,102,.5); box-shadow:0 0 0 6px rgba(223,102,102,.08); }
.sim-stage-line { height:2px; background:#173749; position:relative; overflow:hidden; }
.sim-stage-line i { position:absolute; inset:0 100% 0 0; background:linear-gradient(90deg,var(--dfe-blue),#65cce7); transition:.35s ease; }
.sim-stage-line.done i { right:0; }
.sim-terminal { box-shadow:0 20px 55px rgba(0,0,0,.25); }
.sim-terminal .alert-terminal-output { height:390px; }
.terminal-device .terminal-icon,.terminal-device .terminal-text { color:#9dc7df; }
.terminal-tx .terminal-icon,.terminal-tx .terminal-text { color:#72bceb; }
.terminal-store .terminal-icon { color:#7db6d8; }
.terminal-store .terminal-text { color:#9ab8c8; }
.terminal-suppress { background:rgba(232,179,91,.055); }
.terminal-suppress .terminal-icon,.terminal-suppress .terminal-text { color:#e8ca98; }
.terminal-recover { background:rgba(43,138,212,.06); box-shadow:inset 3px 0 0 #2b8ad4; }
.terminal-recover .terminal-icon,.terminal-recover .terminal-text { color:#8ed0f5; font-weight:700; }
.terminal-reset .terminal-icon,.terminal-reset .terminal-text { color:#8ed0f5; }
.alert-workflow-intro { max-width:850px; margin:0 auto 2rem; text-align:center; }
.alert-workflow-intro .eyebrow { justify-content:center; }
.alert-workflow-intro p { max-width:760px; margin-left:auto; margin-right:auto; }
@media (max-width:991.98px){
  .sim-grid { grid-template-columns:1fr; }
  .sim-controls-panel { border-right:0; border-bottom:1px solid #dbe5ea; }
  .sim-pipeline { overflow-x:auto; padding-bottom:.35rem; }
  .sim-stage { min-width:84px; }
  .sim-stage-line { min-width:35px; }
}
@media (max-width:575.98px){
  .sim-head { align-items:flex-start; flex-direction:column; }
  .sim-head-badges { justify-content:flex-start; }
  .sim-presets { grid-template-columns:1fr; }
  .sim-preset { flex-direction:row; min-height:42px; }
  .sim-runtime { padding:.7rem; }
  .sim-pipeline { grid-template-columns:repeat(5,84px); gap:.35rem; }
  .sim-stage-line { display:none; }
  .sim-terminal .alert-terminal-output { height:340px; }
}


/* ==========================================================
   R3CON INTERACTIVE PRODUCT TOUR
   Purposeful product education, not decorative motion.
   ========================================================== */
.product-tour-shell {
  border: 1px solid #d8e3eb;
  border-radius: 1.35rem;
  background: #fff;
  box-shadow: 0 18px 54px rgba(7,31,49,.08);
  overflow: hidden;
}
.product-tour-head {
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem;
  padding:1.25rem 1.35rem; border-bottom:1px solid #dfe8ee;
  background:linear-gradient(180deg,#fff,#f7fafc);
}
.product-tour-head h3 { margin:0 0 .25rem; font-size:1.15rem; }
.product-tour-head p { margin:0; font-size:.88rem; }
.product-tour-badge { display:inline-flex; align-items:center; gap:.38rem; border:1px solid #b9d4e8; border-radius:999px; padding:.38rem .62rem; color:#0b609a; background:#eef7fd; font-size:.69rem; font-weight:800; white-space:nowrap; }

/* Signal journey */
.signal-journey { padding:1.25rem; background:linear-gradient(145deg,#071b2a,#0b2a42); color:#fff; }
.signal-journey .journey-track { display:grid; grid-template-columns:repeat(9,1fr); align-items:center; gap:.25rem; }
.journey-node { grid-column:span 1; min-width:0; text-align:center; opacity:.54; transition:opacity .25s ease, transform .25s ease; }
.journey-node .journey-icon { width:52px; height:52px; margin:0 auto .5rem; border-radius:1rem; display:grid; place-items:center; background:#0d334f; border:1px solid rgba(121,185,227,.22); color:#8bc8ef; font-size:1.15rem; transition:all .25s ease; }
.journey-node strong { display:block; color:#dbeaf4; font-size:.78rem; }
.journey-node small { display:block; color:#7897aa; font-size:.62rem; margin-top:.12rem; }
.journey-node.active { opacity:1; transform:translateY(-2px); }
.journey-node.active .journey-icon { background:#0e6099; color:#fff; border-color:#3f9ed8; box-shadow:0 0 0 6px rgba(43,138,212,.09),0 0 28px rgba(43,138,212,.23); }
.journey-node.done { opacity:.88; }
.journey-node.done .journey-icon { color:#9be5b5; border-color:rgba(87,201,133,.3); }
.journey-line { position:relative; height:2px; background:rgba(141,185,211,.18); overflow:visible; }
.journey-line::after { content:""; position:absolute; left:0; top:0; bottom:0; width:0; background:#2b8ad4; transition:width .35s ease; }
.journey-line.done::after { width:100%; }
.journey-packet { position:absolute; top:50%; left:0; width:9px; height:9px; margin-top:-4.5px; border-radius:50%; background:#72d497; opacity:0; box-shadow:0 0 14px rgba(87,201,133,.7); }
.journey-line.active .journey-packet { animation:journeyPacket .7s ease both; }
@keyframes journeyPacket { 0%{left:0;opacity:0} 15%{opacity:1} 100%{left:calc(100% - 9px);opacity:.9} }
.journey-status { margin-top:1rem; padding:.78rem 1rem; border-radius:.8rem; background:rgba(0,0,0,.18); border:1px solid rgba(255,255,255,.07); display:flex; align-items:center; justify-content:space-between; gap:1rem; color:#a9c1cf; font-size:.77rem; }
.journey-status strong { color:#fff; }

/* Fleet map */
.fleet-demo { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(290px,.7fr); min-height:560px; }
.fleet-map { min-height:560px; background:#e8eef2; position:relative; }
.fleet-panel { padding:1.15rem; background:#071b2a; color:#fff; }
.fleet-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:.45rem; margin-bottom:1rem; }
.fleet-summary div { padding:.65rem; border-radius:.75rem; background:#0b293f; border:1px solid rgba(255,255,255,.06); }
.fleet-summary strong { display:block; font-size:1.12rem; color:#fff; }
.fleet-summary span { color:#7f9aac; font-size:.62rem; text-transform:uppercase; font-weight:800; }
.fleet-selected { border-top:1px solid rgba(255,255,255,.08); padding-top:1rem; }
.fleet-selected .site-status { display:inline-flex; align-items:center; gap:.35rem; border-radius:999px; padding:.3rem .55rem; font-size:.66rem; font-weight:850; margin-bottom:.65rem; }
.site-status.normal { color:#a0e7b8; background:rgba(87,201,133,.1); border:1px solid rgba(87,201,133,.22); }
.site-status.warning { color:#f1cb83; background:rgba(232,179,91,.1); border:1px solid rgba(232,179,91,.22); }
.site-status.alert { color:#ffaaaa; background:rgba(223,102,102,.12); border:1px solid rgba(223,102,102,.25); }
.fleet-selected h4 { color:#fff; margin-bottom:.2rem; }
.fleet-selected .basin { color:#7896a8; font-size:.75rem; }
.fleet-metrics { display:grid; grid-template-columns:1fr 1fr; gap:.45rem; margin:1rem 0; }
.fleet-metric { padding:.65rem; background:#0b293f; border-radius:.7rem; border:1px solid rgba(255,255,255,.055); }
.fleet-metric span { display:block; color:#7996a7; font-size:.59rem; text-transform:uppercase; font-weight:800; }
.fleet-metric strong { color:#edf7fb; font-size:.95rem; }
.fleet-alert-note { padding:.7rem; border-radius:.7rem; background:rgba(223,102,102,.08); border:1px solid rgba(223,102,102,.18); color:#e8b2b2; font-size:.72rem; margin-bottom:.8rem; }
.fleet-map-note { position:absolute; left:10px; bottom:10px; z-index:500; background:rgba(7,27,42,.88); color:#dceaf2; border:1px solid rgba(255,255,255,.13); border-radius:.55rem; padding:.4rem .6rem; font-size:.62rem; pointer-events:none; }
.leaflet-popup-content-wrapper { border-radius:.8rem !important; }
.leaflet-popup-content { font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; letter-spacing:.02em; }

/* Hardware explorer */
.hardware-explorer { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); gap:1rem; padding:1.2rem; background:#071b2a; }
.hardware-visual { min-height:470px; border-radius:1rem; background:radial-gradient(circle at 50% 35%,#123e5c,#081d2c 70%); border:1px solid rgba(255,255,255,.08); padding:1.2rem; position:relative; }
.device-outline { width:min(360px,82%); aspect-ratio:4/5; margin:0 auto; border-radius:1.2rem; background:#dfe9ee; border:8px solid #a8bac3; padding:1.15rem; box-shadow:0 25px 55px rgba(0,0,0,.32); position:relative; }
.device-pcb { position:absolute; inset:13% 11%; border-radius:.65rem; background:#0b5a52; border:2px solid #88ada6; box-shadow:inset 0 0 0 5px rgba(255,255,255,.035); }
.hw-block { position:absolute; border-radius:.35rem; background:#0d2531; border:1px solid rgba(255,255,255,.2); }
.hw-block.b1{left:9%;top:10%;width:35%;height:20%}.hw-block.b2{right:8%;top:10%;width:34%;height:28%}.hw-block.b3{left:8%;top:39%;width:42%;height:22%}.hw-block.b4{right:7%;top:46%;width:34%;height:18%}.hw-block.b5{left:7%;bottom:8%;width:86%;height:15%}
.hw-hotspot { position:absolute; width:30px; height:30px; border-radius:50%; border:2px solid #fff; background:#1474bd; color:#fff; display:grid; place-items:center; font:800 .7rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; cursor:pointer; box-shadow:0 0 0 6px rgba(43,138,212,.15); transition:transform .18s ease, background .18s ease; z-index:5; }
.hw-hotspot:hover,.hw-hotspot.active { transform:scale(1.08); background:#57c985; }
.hw-hotspot[data-part="temperature"]{left:17%;top:25%}.hw-hotspot[data-part="pressure"]{left:16%;top:49%}.hw-hotspot[data-part="pulse"]{right:17%;top:55%}.hw-hotspot[data-part="rs485"]{right:18%;bottom:22%}.hw-hotspot[data-part="lte"]{right:16%;top:22%}.hw-hotspot[data-part="storage"]{left:28%;bottom:20%}.hw-hotspot[data-part="power"]{left:48%;bottom:13%}
.hardware-info { border-radius:1rem; background:#0b293f; border:1px solid rgba(255,255,255,.07); padding:1.25rem; }
.hardware-info .smallcaps { color:#6c9fc0; }
.hardware-info h3 { color:#fff; }
.hardware-info p { color:#93adbc; }
.hardware-info ul { color:#bdd0da; padding-left:1.1rem; font-size:.86rem; }
.hardware-info .hw-instruction { color:#6e8b9c; font-size:.72rem; border-top:1px solid rgba(255,255,255,.08); padding-top:.8rem; }

/* Architecture switch */
.arch-switch { padding:1.2rem; }
.arch-controls { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1rem; }
.arch-btn { border:1px solid #b7cad7; background:#fff; color:#315264; border-radius:.7rem; padding:.55rem .8rem; font-weight:800; font-size:.78rem; }
.arch-btn.active { background:#1474bd; border-color:#1474bd; color:#fff; }
.arch-lanes { display:grid; gap:.7rem; }
.arch-lane { border:1px solid #d9e5ec; border-radius:1rem; padding:1rem; background:#f9fbfc; transition:opacity .2s ease; }
.arch-lane.dim { opacity:.32; }
.arch-lane h4 { margin:0 0 .65rem; font-size:.95rem; }
.arch-flow { display:flex; align-items:center; gap:.38rem; flex-wrap:wrap; }
.arch-node { padding:.5rem .65rem; border-radius:.55rem; background:#eaf4fb; border:1px solid #c6dfef; color:#164f73; font-weight:750; font-size:.72rem; }
.arch-node.control { background:#f6f1e6; border-color:#ead8ad; color:#765a20; }
.arch-arrow { color:#8198a7; }

/* Field trip comparison */
.trip-compare { padding:1.2rem; }
.trip-controls { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1rem; }
.trip-btn { border:1px solid #b6cbd9; border-radius:.65rem; background:#fff; padding:.55rem .78rem; font-weight:800; font-size:.75rem; color:#365566; }
.trip-btn.active { color:#fff; background:#1474bd; border-color:#1474bd; }
.trip-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.trip-lane { border:1px solid #dce6ec; border-radius:1rem; padding:1rem; background:#fafcfd; min-height:285px; }
.trip-lane h4 { font-size:.95rem; margin-bottom:.15rem; }
.trip-lane p { font-size:.78rem; }
.trip-road { position:relative; height:68px; margin:1rem 0; border-radius:999px; background:linear-gradient(180deg,#d4dce0 0 42%,#89979e 42% 58%,#d4dce0 58%); overflow:hidden; }
.trip-road::after { content:""; position:absolute; left:0; right:0; top:50%; border-top:2px dashed rgba(255,255,255,.75); }
.trip-truck { position:absolute; left:4%; top:17px; z-index:2; font-size:1.65rem; color:#0c5f93; transform:translateX(0); }
.trip-road.run .trip-truck { animation:truckTrip 2.8s ease-in-out both; }
.trip-road.hold .trip-truck { opacity:.55; }
@keyframes truckTrip { 0%{left:4%} 45%{left:82%} 58%{left:82%} 100%{left:4%} }
.trip-remote-flow { display:flex; align-items:center; gap:.4rem; justify-content:center; min-height:74px; }
.trip-remote-flow span { width:46px; height:46px; border-radius:.7rem; display:grid; place-items:center; background:#e8f4fb; color:#12659a; border:1px solid #c9dfed; }
.trip-remote-flow i.arrow { color:#8ea2ad; }
.trip-remote-flow.active span { animation:remotePulse .45s ease both; }
@keyframes remotePulse { 50%{transform:translateY(-3px);background:#dff6e8;color:#278552;border-color:#bce5cb} }
.trip-result { border-radius:.7rem; padding:.7rem .8rem; background:#edf6fb; border:1px solid #d0e5f2; color:#36586a; font-size:.77rem; min-height:62px; }
.trip-result.alert { background:#fff0f0; border-color:#f0caca; color:#8c4545; }
.trip-result.good { background:#ebf8f0; border-color:#c7e9d3; color:#316d48; }

/* Pulse meter visual */
.pulse-meter-demo { padding:1.2rem; }
.pulse-meter-grid { display:grid; grid-template-columns:minmax(250px,.8fr) 1.2fr; gap:1rem; align-items:stretch; }
.meter-face { border-radius:1rem; padding:1rem; background:#f6f0e3; border:1px solid #d9cfb9; box-shadow:inset 0 0 0 5px rgba(255,255,255,.55); }
.meter-window { background:#20272b; color:#f2f4f5; border-radius:.45rem; padding:.7rem 1rem; font:800 1.55rem 'Inter', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; letter-spacing:.08em; text-align:center; }
.meter-dial { width:150px; height:150px; margin:1rem auto; border-radius:50%; border:9px solid #d5d0c5; background:radial-gradient(circle,#fff 0 65%,#e2ddd1 66%); position:relative; }
.meter-dial::before { content:"PULSE"; position:absolute; inset:0; display:grid; place-items:center; color:#7a7061; font:800 .72rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.meter-needle { position:absolute; width:3px; height:55px; background:#b54444; left:50%; top:20px; transform-origin:50% 55px; transform:rotate(0deg); transition:transform .18s ease; }
.pulse-flash { width:12px; height:12px; border-radius:50%; background:#456; margin:.5rem auto 0; }
.pulse-flash.flash { animation:pulseFlash .35s ease; }
@keyframes pulseFlash { 50%{background:#57c985;box-shadow:0 0 0 8px rgba(87,201,133,.18),0 0 18px rgba(87,201,133,.5)} }
.pulse-runtime { border-radius:1rem; padding:1rem; background:#071b2a; color:#fff; }
.pulse-runtime h4 { color:#fff; }
.pulse-runtime-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.45rem; margin:.85rem 0; }
.pulse-runtime-grid div { background:#0b293f; border:1px solid rgba(255,255,255,.055); border-radius:.65rem; padding:.65rem; }
.pulse-runtime-grid span { display:block; color:#7894a6; font-size:.58rem; text-transform:uppercase; font-weight:800; }
.pulse-runtime-grid strong { color:#f1f8fb; }
.pulse-log { min-height:115px; padding:.7rem; background:#04131f; border-radius:.7rem; border:1px solid rgba(255,255,255,.06); font: .72rem/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; color:#96b2c2; }
.pulse-log .hi { color:#93e0ad; }

/* Freeze event visual */
.freeze-visual { padding:1.2rem; }
.freeze-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:1rem; }
.freeze-equipment { min-height:330px; border-radius:1rem; position:relative; overflow:hidden; background:linear-gradient(180deg,#eaf2f7,#d8e6ee); border:1px solid #cddbe4; }
.freeze-sky { position:absolute; inset:0 0 48% 0; background:linear-gradient(180deg,#c8dce9,#eaf2f7); }
.freeze-ground { position:absolute; left:0;right:0;bottom:0;height:48%; background:linear-gradient(#d8e0e4,#c7d0d4); }
.freeze-pipe { position:absolute; left:10%; right:10%; top:48%; height:34px; border-radius:18px; background:linear-gradient(#687b85,#334954); box-shadow:0 8px 0 rgba(0,0,0,.06); }
.freeze-vessel { position:absolute; right:15%; top:22%; width:88px; height:160px; border-radius:35px; background:linear-gradient(90deg,#667a84,#a4b5bd,#5c7079); border:3px solid #4a606b; }
.freeze-sensor { position:absolute; min-width:92px; padding:.45rem .55rem; border-radius:.55rem; background:#071b2a; color:#fff; border:1px solid rgba(255,255,255,.14); font-size:.65rem; box-shadow:0 8px 20px rgba(0,0,0,.12); }
.freeze-sensor strong { display:block; color:#fff; font-size:.85rem; }
.freeze-sensor.low { left:18%; top:55%; }.freeze-sensor.sep { right:8%; top:30%; }.freeze-sensor.encl { left:43%; top:27%; }.freeze-sensor.ambient { left:8%; top:12%; }
.freeze-sensor.alert { background:#7b252a; border-color:#e28e92; animation:freezeAlert 1.1s ease infinite alternate; }
@keyframes freezeAlert { to{box-shadow:0 0 0 6px rgba(223,102,102,.12),0 0 25px rgba(223,102,102,.18)} }
.freeze-controls { border-radius:1rem; border:1px solid #dce5ea; background:#fff; padding:1rem; }
.freeze-controls input[type=range] { width:100%; }
.freeze-timeline { margin-top:1rem; height:76px; position:relative; border-radius:.65rem; background:linear-gradient(180deg,#f8fbfc,#edf3f6); border:1px solid #dde7ec; overflow:hidden; }
.freeze-timeline .threshold-line { position:absolute; left:0; right:0; top:63%; border-top:2px dashed #df6666; }
.freeze-timeline .temp-line { position:absolute; left:5%; right:5%; top:25%; height:3px; background:#1474bd; transform-origin:left; transition:transform .6s ease, top .6s ease; }

@media(max-width:991.98px){
  .fleet-demo,.hardware-explorer,.pulse-meter-grid,.freeze-grid,.trip-grid{grid-template-columns:1fr}
  .fleet-map{min-height:430px}.fleet-demo{min-height:0}.hardware-visual{min-height:420px}
  .signal-journey .journey-track{grid-template-columns:1fr 24px 1fr 24px 1fr 24px 1fr 24px 1fr}
}
@media(max-width:575.98px){
  .product-tour-head{flex-direction:column}.fleet-summary,.pulse-runtime-grid{grid-template-columns:1fr 1fr}
  .journey-node .journey-icon{width:42px;height:42px}.journey-node strong{font-size:.65rem}.journey-node small{display:none}
  .hardware-explorer{padding:.7rem}.hardware-visual{min-height:360px}.device-outline{width:88%}
}
@media(prefers-reduced-motion:reduce){
  .journey-line.active .journey-packet,.trip-road.run .trip-truck,.trip-remote-flow.active span,.freeze-sensor.alert,.pulse-flash.flash{animation:none!important}
}

/* v8 refinement: accessibility, active navigation and dev-only visual planning */
.skip-link{position:fixed;left:1rem;top:.75rem;z-index:99999;background:#fff;color:#061725;padding:.65rem .9rem;border-radius:.55rem;box-shadow:0 8px 30px rgba(0,0,0,.18);transform:translateY(-160%);transition:transform .15s ease}
.skip-link:focus{transform:translateY(0)}
.nav-link[aria-current="page"],.dropdown-item[aria-current="page"]{color:#79c1f3!important;font-weight:700}


/* v9 brand, diagrams, careers and production-form refinements */
.navbar-brand .brand-bug{width:34px;height:34px;object-fit:contain;margin-right:.55rem;border-radius:0;display:block}
.brand-mark{display:none!important}
.text-white .callout p,.bg-ink .callout p{color:#405967!important}
.text-white .callout strong,.bg-ink .callout strong{color:#0c2a3b!important}

/* Pulse indicator belongs inside the meter face, not underneath it. */
.meter-dial .pulse-flash{position:absolute;left:50%;bottom:17px;transform:translateX(-50%);margin:0;width:12px;height:12px;border-radius:50%;background:#456;z-index:4;border:2px solid rgba(255,255,255,.9);box-sizing:content-box}
.meter-dial .pulse-flash.flash{animation:pulseFlash .35s ease}

.dfe-diagram{border:1px solid #cfe0ea;border-radius:1.2rem;background:linear-gradient(145deg,#f9fcfe,#edf5fa);box-shadow:0 18px 50px rgba(7,35,53,.08);padding:1.5rem;overflow:hidden;position:relative}
.dfe-diagram::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(20,116,189,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(20,116,189,.035) 1px,transparent 1px);background-size:28px 28px;pointer-events:none}
.dfe-diagram>*{position:relative;z-index:1}
.diagram-head{display:flex;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1.35rem}
.diagram-head h3{margin:0;font-size:1.25rem}
.diagram-kicker{color:var(--dfe-blue-deep);font:800 .67rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;text-transform:uppercase;letter-spacing:.09em!important}
.diagram-note{margin-top:1rem;border-radius:.75rem;background:#fff;border:1px solid #d6e4ec;padding:.75rem .9rem;display:flex;gap:.65rem;align-items:flex-start;color:#4d6674;font-size:.78rem}.diagram-note i{color:var(--dfe-blue);margin-top:.2rem}

/* remote monitoring decision map */
.decision-origin{width:min(520px,100%);margin:0 auto;display:flex;align-items:center;gap:.8rem;border-radius:.8rem;padding:.9rem 1rem;background:#071b2a;color:#fff;box-shadow:0 12px 30px rgba(7,27,42,.16)}
.decision-origin i{width:42px;height:42px;display:grid;place-items:center;border-radius:.65rem;background:var(--dfe-blue);font-size:1rem}.decision-origin strong,.decision-origin span{display:block}.decision-origin span{color:#9db4c2;font-size:.75rem;margin-top:.1rem}
.decision-split{height:42px;position:relative}.decision-split::before{content:"";position:absolute;left:50%;top:0;height:22px;border-left:2px solid #9eb7c6}.decision-split span{position:absolute;left:20%;right:20%;top:21px;border-top:2px solid #9eb7c6}.decision-split span::before,.decision-split span::after{content:"";position:absolute;top:0;height:20px;border-left:2px solid #9eb7c6}.decision-split span::before{left:0}.decision-split span::after{right:0}
.decision-columns{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.decision-path{position:relative;background:#fff;border:1px solid #d6e4ec;border-radius:1rem;padding:1rem;min-height:335px}.decision-path.monitor-path{border-color:#bcd9eb;box-shadow:inset 0 4px 0 var(--dfe-blue)}.decision-path.control-path{box-shadow:inset 0 4px 0 #c29a4b}
.decision-question{display:flex;gap:.55rem;align-items:center;color:#173a4d;font:800 .8rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif}.decision-question i{width:32px;height:32px;border-radius:.55rem;display:grid;place-items:center;background:#edf5fa;color:var(--dfe-blue-deep)}
.decision-answer{position:absolute;right:.8rem;top:.8rem;font:850 .58rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;padding:.25rem .45rem;border-radius:999px}.decision-answer.yes{background:#f6efd9;color:#755914}.decision-answer.no{background:#e5f6eb;color:#247646}
.decision-stack{display:grid;justify-items:center;gap:.35rem;margin:1rem 0}.decision-stack span{width:100%;text-align:center;border-radius:.6rem;border:1px solid #d7e3e9;background:#f8fbfc;padding:.55rem;color:#365768;font-weight:750;font-size:.72rem}.decision-stack i{color:#92aab7;font-size:.65rem}.decision-result{display:block;color:#0b2b3d;margin:.7rem 0 .25rem;font-size:.88rem}.decision-path p{font-size:.76rem;margin:0}
.decision-checks{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-top:1rem}.decision-checks span{background:#071b2a;color:#d9eaf2;border-radius:.65rem;padding:.55rem;text-align:center;font-size:.68rem;font-weight:700}.decision-checks i{color:var(--dfe-green);margin-right:.25rem}

/* SCADA vs monitoring scope */
.scope-grid{display:grid;grid-template-columns:1fr 58px 1fr;gap:.8rem;align-items:stretch}.scope-lane{border-radius:1rem;background:#fff;border:1px solid #d6e3e9;padding:1rem}.scope-lane.monitoring{box-shadow:inset 0 4px 0 var(--dfe-blue)}.scope-lane.control{box-shadow:inset 0 4px 0 #b28b40}.scope-title{display:flex;align-items:center;gap:.7rem}.scope-title .scope-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:.65rem;background:#eaf4fb;color:var(--dfe-blue-deep)}.scope-lane.control .scope-icon{background:#f7f0de;color:#80651d}.scope-title strong,.scope-title small{display:block}.scope-title small{color:#6b7f8a;font-size:.67rem}.scope-flow{display:flex;align-items:center;gap:.32rem;flex-wrap:wrap;margin:1rem 0}.scope-flow span{padding:.42rem .55rem;border-radius:.5rem;background:#f5f9fb;border:1px solid #d6e4eb;color:#355768;font-size:.65rem;font-weight:750}.scope-flow i{font-size:.58rem;color:#8ea6b4}.scope-lane ul{padding-left:1.05rem;color:#5a6d78;font-size:.75rem;margin-bottom:0}.scope-vs{display:grid;place-items:center;color:#7892a1;font:850 .68rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif}.scope-bottom{margin-top:1rem;border-radius:.8rem;background:#071b2a;color:#fff;padding:.9rem 1rem;display:grid;grid-template-columns:auto auto 1fr;gap:.65rem;align-items:center}.scope-bottom i{color:#69b4e6}.scope-bottom strong{font-size:.78rem}.scope-bottom span{color:#9db4c2;font-size:.72rem}

/* Pulse guide */
.pulse-guide-flow{display:grid;grid-template-columns:minmax(170px,.8fr) minmax(110px,.42fr) minmax(170px,.8fr) minmax(110px,.42fr) minmax(220px,1fr);gap:.65rem;align-items:center}.pulse-guide-card{background:#fff;border:1px solid #d6e3e9;border-radius:1rem;padding:1rem;min-height:230px;display:flex;flex-direction:column;justify-content:center;text-align:center}.pg-label{text-transform:uppercase;font:800 .59rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;color:#6c7f89;letter-spacing:.08em!important}.pg-counter{margin:.65rem 0;background:#20272b;color:#fff;border-radius:.55rem;padding:.55rem;font:800 1.28rem 'Inter', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;letter-spacing:.07em!important}.pg-counter.blue{background:#0b5e91}.pg-dial{width:78px;height:78px;margin:.15rem auto .6rem;border-radius:50%;border:6px solid #d6d0c4;display:grid;place-items:center;position:relative;background:#fff;color:#7c7060;font:800 .58rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif}.pg-dial i{position:absolute;width:3px;height:27px;background:#b54444;left:50%;top:11px;transform-origin:50% 28px}.pulse-guide-card small{color:#6a7d87;font-size:.66rem}.pg-chip{display:flex;align-items:center;justify-content:center;gap:.45rem;color:#174c6a;margin-top:.7rem}.pg-chip i{color:var(--dfe-blue)}.pg-chip strong{font-size:.72rem}.pulse-guide-card.backend code{display:block;text-align:left;border-radius:.45rem;background:#071b2a;color:#9fd7f5;padding:.48rem .55rem;margin:.25rem 0;font-size:.66rem}.pg-result{background:#e8f6ed;color:#216942;border-radius:.65rem;margin:.5rem 0;padding:.6rem;font:850 1.05rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif}.pg-result span{display:block;font-size:.54rem;text-transform:uppercase}.pg-arrow{text-align:center;color:#55717f}.pg-arrow span,.pg-arrow b{display:block;font-size:.58rem}.pg-arrow i{display:block;color:var(--dfe-blue);font-size:1.25rem;margin:.35rem}.pg-arrow b{color:#183f55}

/* Partner model */
.partner-model{border-radius:1.2rem;padding:1.15rem;background:linear-gradient(145deg,#0a2232,#071722);border:1px solid rgba(255,255,255,.09);box-shadow:0 20px 50px rgba(0,0,0,.23);color:#fff}.partner-model-head span{display:block;color:#6eb3df;font:800 .58rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;text-transform:uppercase;letter-spacing:.09em!important}.partner-model-head strong{display:block;color:#fff;font-size:.95rem;margin-top:.2rem}.partner-model-stage{margin-top:1rem;display:grid;grid-template-columns:1fr 50px 1fr;grid-template-areas:"customer link partner" ". support ." ". dfelab .";gap:.7rem;align-items:center}.pm-node{border-radius:.85rem;background:#0d3048;border:1px solid rgba(255,255,255,.09);padding:.85rem;text-align:center}.pm-node.customer{grid-area:customer}.pm-node.partner{grid-area:partner;border-color:rgba(80,170,227,.45);box-shadow:inset 0 3px 0 var(--dfe-blue-bright)}.pm-node.dfelab{grid-area:dfelab;background:#0a293d}.pm-icon{width:38px;height:38px;margin:0 auto .45rem;border-radius:.65rem;display:grid;place-items:center;background:#1474bd;color:#fff}.pm-node strong,.pm-node small{display:block}.pm-node strong{font-size:.78rem;color:#fff}.pm-node small{font-size:.6rem;color:#8faabb;margin-top:.15rem}.pm-link{grid-area:link;text-align:center;color:#65b8eb}.pm-link span{display:block;font-size:.52rem;color:#8da6b5;white-space:nowrap;transform:translateX(-8px)}.pm-support-line{grid-area:support;display:flex;flex-direction:column;align-items:center;color:#6eb6df;font-size:.55rem;text-align:center}.pm-support-line i{font-size:.75rem}.partner-model-foot{display:grid;grid-template-columns:1fr;gap:.4rem;margin-top:.9rem}.partner-model-foot span{border-radius:.55rem;background:rgba(255,255,255,.045);padding:.48rem;color:#a9bfca;font-size:.58rem}.partner-model-foot i{width:20px;color:#66b5e6}

/* Careers */
.career-signal-card{border-radius:1.2rem;background:#071b2a;border:1px solid rgba(255,255,255,.11);padding:1.25rem;box-shadow:0 22px 55px rgba(0,0,0,.24)}.career-signal-head{display:flex;align-items:center;gap:.55rem;color:#fff;font:800 .68rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;letter-spacing:.08em!important}.career-signal-head .status-dot{width:9px;height:9px;border-radius:50%;background:var(--dfe-green);box-shadow:0 0 0 6px rgba(87,201,133,.11)}.career-signal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:1rem 0}.career-signal-grid span{border-radius:.7rem;background:#0b3049;border:1px solid rgba(255,255,255,.06);min-height:95px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;color:#74bdeb}.career-signal-grid b{color:#fff;font-size:.66rem}.career-signal-card p{color:#91aab8;font-size:.78rem;margin:0}.career-card{height:100%;border:1px solid #d9e4e9;border-radius:1rem;padding:1.2rem;background:#fff;box-shadow:0 12px 35px rgba(7,35,53,.06)}.career-card .check-list li{font-size:.76rem}.career-principles{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.career-principles>div{border:1px solid #d7e3e9;border-radius:.9rem;background:#fff;padding:1rem}.career-principles i{color:var(--dfe-blue);font-size:1.1rem}.career-principles strong,.career-principles span{display:block}.career-principles strong{color:#16384a;margin:.4rem 0 .15rem}.career-principles span{color:#657a86;font-size:.76rem}.dfe-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.dfe-submit-form{position:relative}.form-response{font-size:.88rem}

@media(max-width:991.98px){.pulse-guide-flow{grid-template-columns:1fr}.pg-arrow i{transform:rotate(90deg)}.decision-checks{grid-template-columns:1fr 1fr}.scope-grid{grid-template-columns:1fr}.scope-vs{min-height:20px}.scope-bottom{grid-template-columns:auto 1fr}.scope-bottom span{grid-column:1/-1}.partner-model-stage{grid-template-columns:1fr 42px 1fr}.career-signal-grid{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:575.98px){.decision-columns{grid-template-columns:1fr}.decision-split{display:none}.decision-checks,.career-principles{grid-template-columns:1fr}.partner-model-stage{grid-template-columns:1fr;grid-template-areas:"customer" "link" "partner" "support" "dfelab"}.pm-link i{transform:rotate(90deg)}.pm-link span{transform:none}.career-signal-grid{grid-template-columns:1fr}.diagram-head{display:block}.diagram-kicker{display:block;margin-bottom:.35rem}}

/* ==========================================================
   V10 LIVE ALERT DELIVERY
   Optional real email/SMS delivery inside the simulator.
   ========================================================== */
.sim-live-alert {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid #cddfe9;
  border-radius: .95rem;
  background: linear-gradient(180deg,#f9fcfe,#f2f8fb);
}
.sim-live-alert-head { display:flex; gap:.7rem; align-items:flex-start; margin-bottom:.8rem; }
.sim-live-alert-head>span { width:36px; height:36px; flex:0 0 36px; border-radius:.7rem; display:grid; place-items:center; color:#fff; background:var(--dfe-blue); box-shadow:0 6px 18px rgba(20,116,189,.18); }
.sim-live-alert-head strong { display:block; color:#14394d; font:800 .8rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.sim-live-alert-head small { display:block; margin-top:.15rem; color:#667d89; font-size:.7rem; line-height:1.45; }
.sim-live-fields { display:grid; grid-template-columns:.85fr 1.2fr 1fr; gap:.55rem; }
.sim-live-fields label { display:block; margin-bottom:.25rem; color:#405d6d; font-size:.64rem; font-weight:800; }
.sim-live-fields label span { color:#8496a0; font-weight:600; }
.sim-live-fields .form-control { min-height:36px; font-size:.75rem; letter-spacing:.02em; }
.sim-live-check { display:flex; gap:.5rem; align-items:flex-start; margin:.7rem 0 0; color:#536c79; font-size:.66rem; line-height:1.4; cursor:pointer; }
.sim-live-check input { margin-top:.15rem; accent-color:var(--dfe-blue); }
.sim-live-check.marketing { padding-top:.65rem; border-top:1px solid #dce7ed; }
.sim-live-privacy { display:flex; gap:.4rem; align-items:flex-start; margin-top:.65rem; color:#748993; font-size:.61rem; line-height:1.45; }
.sim-live-privacy i { color:var(--dfe-blue); margin-top:.12rem; }
.sim-live-response { margin-top:.7rem; border-radius:.65rem; padding:.58rem .68rem; font-size:.68rem; line-height:1.4; }
.sim-live-response.sending,.sim-live-response.neutral { background:#eaf4fb; color:#245b7b; border:1px solid #cbe0ee; }
.sim-live-response.success { background:#e8f6ed; color:#216942; border:1px solid #bfe2ca; }
.sim-live-response.error { background:#fff0ef; color:#8f3935; border:1px solid #edc6c3; }
.sim-live-response i { margin-right:.35rem; }
@media(max-width:767.98px){.sim-live-fields{grid-template-columns:1fr}.sim-live-alert{padding:.85rem}}
.sim-live-alert>summary { list-style:none; cursor:pointer; margin:0; }
.sim-live-alert>summary::-webkit-details-marker { display:none; }
.sim-live-alert:not([open]) { padding:.75rem .85rem; }
.sim-live-alert:not([open]) .sim-live-alert-head { margin-bottom:0; align-items:center; }
.sim-live-alert[open] .sim-live-alert-head { margin-bottom:.65rem; padding-bottom:.65rem; border-bottom:1px solid #dce7ed; }
.sim-live-chevron { margin-left:auto; color:#6c8796; font-size:.68rem; transition:transform .18s ease; }
.sim-live-alert[open] .sim-live-chevron { transform:rotate(180deg); }
.sim-live-alert-body { padding-top:.1rem; }
.sim-live-intro { margin:0 0 .75rem; color:#627985; font-size:.7rem; }


/* v11 layout polish: natural-height support cards, real image slots and corrected demo indicators */
.info-card,
.form-shell { height:auto; }
.resource-aside { height:auto !important; align-self:flex-start; }
.row > [class*="col-"] > .info-card,
.row > [class*="col-"] > .form-shell { align-self:flex-start; }

.site-image-slot{margin:0;width:100%;align-self:flex-start}
.site-image-slot img{display:block;width:100%;height:auto;border-radius:1.15rem;border:1px solid #cbdce6;background:#edf5fa;box-shadow:0 18px 48px rgba(7,35,53,.08)}
.site-image-slot.hero-media{margin-top:.25rem;background:transparent!important;padding:0!important;overflow:visible!important}.site-image-slot.hero-media::before,.site-image-slot.hero-media::after{content:none!important;display:none!important}.site-image-slot.hero-media img{aspect-ratio:4/5;object-fit:cover;max-height:none;background:transparent}
.site-image-slot.compact img{aspect-ratio:4/3;object-fit:cover}
.site-image-slot.wide img{aspect-ratio:16/7;object-fit:cover}
.site-image-slot.dark img{border-color:rgba(255,255,255,.12);box-shadow:0 20px 55px rgba(0,0,0,.24)}

/* Make the pulse indicator read as an intentional labeled LED instead of a loose dot. */
.meter-dial .pulse-output-led{position:absolute;right:18px;top:18px;display:flex;align-items:center;gap:6px;z-index:5;padding:4px 7px;border-radius:999px;background:rgba(255,255,255,.82);border:1px solid rgba(8,34,53,.12);box-shadow:0 4px 12px rgba(8,34,53,.08)}
.meter-dial .pulse-output-led .pulse-flash{position:static;left:auto;right:auto;top:auto;bottom:auto;transform:none;margin:0;width:9px;height:9px;border-radius:50%;background:#435c6c;border:0;box-sizing:border-box;box-shadow:0 0 0 3px rgba(67,92,108,.10)}
.meter-dial .pulse-output-led small{font:800 .48rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;letter-spacing:.06em!important;color:#536b78;white-space:nowrap}
.meter-dial .pulse-output-led .pulse-flash.flash{animation:pulseFlash .35s ease}

/* Partner model: DFELAB support spans the full diagram width instead of collapsing into the connector column. */
.partner-model-stage{grid-template-columns:1fr 64px 1fr;grid-template-areas:"customer link partner" "support support support" "dfelab dfelab dfelab";align-items:center}
.pm-support-line{flex-direction:row;justify-content:center;gap:.45rem;padding:.15rem 0}
.pm-support-line i{transform:rotate(90deg)}
.pm-node.dfelab{width:min(430px,100%);justify-self:center;display:grid;grid-template-columns:auto 1fr;column-gap:.75rem;align-items:center;text-align:left;padding:1rem 1.15rem}
.pm-node.dfelab .pm-icon{grid-row:1/3;margin:0}
.pm-node.dfelab strong,.pm-node.dfelab small{text-align:left}
.partner-model-foot{grid-template-columns:repeat(3,1fr)}

.navbar .dropdown-toggle[type="button"]{background:transparent;border:0;text-align:left}

@media(max-width:575.98px){
  .partner-model-stage{grid-template-columns:1fr;grid-template-areas:"customer" "link" "partner" "support" "dfelab"}
  .pm-support-line{flex-direction:column}.pm-support-line i{transform:none}
  .pm-node.dfelab{display:block;text-align:center}.pm-node.dfelab .pm-icon{margin:0 auto .45rem}.pm-node.dfelab strong,.pm-node.dfelab small{text-align:center}
  .partner-model-foot{grid-template-columns:1fr}
}

/* v12 publishing engine, newsletter and content sharing */
.newsletter-cta{display:grid;grid-template-columns:1.15fr .85fr;gap:2rem;align-items:center;padding:1.6rem;border:1px solid #cbdde7;border-radius:1.2rem;background:linear-gradient(135deg,#fff,#edf6fb)}
.newsletter-cta h2{margin:.25rem 0 .5rem}.newsletter-cta p{margin:0;color:#5e7581}.newsletter-fields{display:grid;grid-template-columns:1fr auto;gap:.55rem}.newsletter-consent{display:flex;gap:.45rem;align-items:flex-start;margin-top:.55rem;color:#647b87;font-size:.72rem;line-height:1.35}.newsletter-consent input{margin-top:.12rem;accent-color:var(--dfe-blue)}.newsletter-response{margin-top:.6rem;padding:.55rem .65rem;border-radius:.6rem;font-size:.74rem}.newsletter-response.success{background:#e8f6ed;color:#216942;border:1px solid #bfe2ca}.newsletter-response.error{background:#fff0ef;color:#8f3935;border:1px solid #edc6c3}.newsletter-cta.compact{padding:1.25rem}
.content-hero{padding:9rem 0 4.5rem;background:linear-gradient(135deg,#071b2a,#0a3150);color:#fff}.content-hero h1{color:#fff;max-width:950px}.content-hero .lead{color:#c4d8e4}.content-reading-width{max-width:930px}.content-reading-wide{max-width:1120px}.content-byline{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.2rem;color:#9db6c5;font-size:.8rem;font-weight:700}.content-share{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;margin-top:1.2rem}.content-share-label{font:800 .68rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;letter-spacing:.05em;text-transform:uppercase;color:#7895a6;margin-right:.2rem}.share-btn{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.07);color:#fff;cursor:pointer}.content-article>.content-share .share-btn{border-color:#c8dce7;background:#f4f8fa;color:#155e8c}.content-article>.content-share .content-share-label{color:#6d8592}.share-btn:hover,.share-btn.copied{background:var(--dfe-blue);border-color:var(--dfe-blue);color:#fff}.content-feature{margin-top:-1.5rem}.content-feature img{width:100%;max-height:620px;object-fit:cover;border-radius:1.2rem;border:1px solid #d3e0e7}.content-article{font-size:1.08rem;line-height:1.75}.content-article h2{margin-top:2.8rem}.content-image img{width:100%;height:auto;border-radius:1rem;border:1px solid #d4e1e8}.content-image figcaption{font-size:.76rem;color:#71858f;margin-top:.55rem}.content-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}.content-card{background:#fff;border:1px solid #d9e5eb;border-radius:1.1rem;overflow:hidden;display:flex;flex-direction:column}.content-card>img{width:100%;aspect-ratio:16/9;object-fit:cover}.content-card-body{padding:1.15rem;display:flex;flex-direction:column;flex:1}.content-card h2{font-size:1.18rem;margin:.25rem 0 .65rem}.content-card h2 a{color:#173f56}.content-card p{color:#617885}.content-card .card-link{margin-top:auto}.content-meta{font-size:.7rem;color:#8497a1;margin-bottom:.8rem}
@media(max-width:991.98px){.newsletter-cta{grid-template-columns:1fr}.content-grid{grid-template-columns:1fr 1fr}}@media(max-width:575.98px){.newsletter-fields{grid-template-columns:1fr}.content-grid{grid-template-columns:1fr}.content-hero{padding-top:7.5rem}}

/* ==========================================================
   V13 MOBILE / RESPONSIVE REFINEMENT
   ========================================================== */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body { min-width: 0; }
/* Keep Bootstrap's native .container max-width breakpoints on desktop.
   Only flexible/custom components receive overflow containment here. */
main, section, header, footer, .container, .container-fluid, .row, [class*="col-"] {
  min-width: 0;
}
.container-fluid,
.product-tour-shell, .r3-simulator, .dfe-live-demo, .dfe-diagram, .newsletter-cta {
  min-width: 0;
  max-width: 100%;
}
img, svg, video, canvas, iframe { max-width: 100%; }
p, li, a, strong, small, code { overflow-wrap: anywhere; }
.leaflet-container { max-width: 100%; }

/* Mobile navigation uses an intentional DFELAB blue panel instead of Bootstrap's near-black dropdown. */
@media (max-width: 991.98px) {
  .navbar { padding-top: .55rem; padding-bottom: .55rem; }
  .navbar > .container { max-width: 100%; }
  .navbar-collapse {
    margin-top: .7rem;
    padding: .75rem;
    border: 1px solid rgba(112,185,232,.18);
    border-radius: .9rem;
    background: #08273d;
    box-shadow: 0 18px 42px rgba(0,0,0,.24);
    max-height: calc(100dvh - 84px);
    overflow-y: auto;
    overflow-x: hidden;
  }
  .navbar-nav { align-items: stretch !important; gap: .15rem; }
  .navbar .nav-link,
  .navbar .dropdown-toggle[type="button"] {
    width: 100%;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .7rem .75rem;
    border-radius: .62rem;
    color: #d6e6f0 !important;
  }
  .navbar .nav-link:hover,
  .navbar .nav-link.active,
  .navbar .dropdown-toggle.show {
    background: rgba(43,138,212,.13);
    color: #8dd0fb !important;
  }
  .navbar .dropdown-menu,
  .navbar .dropdown-menu-dark {
    position: static !important;
    float: none !important;
    width: 100%;
    margin: .15rem 0 .45rem;
    padding: .35rem;
    transform: none !important;
    background: #0d3854 !important;
    border: 1px solid rgba(126,197,240,.16) !important;
    border-radius: .72rem;
    box-shadow: none !important;
  }
  .navbar .dropdown-item {
    min-height: 42px;
    display: flex;
    align-items: center;
    white-space: normal;
    border-radius: .5rem;
    padding: .58rem .7rem;
    color: #d9eaf4 !important;
    font-size: .91rem;
  }
  .navbar .dropdown-item:hover,
  .navbar .dropdown-item:focus,
  .navbar .dropdown-item.active,
  .navbar .dropdown-item[aria-current="page"] {
    background: rgba(43,138,212,.20) !important;
    color: #fff !important;
  }
  .navbar .dropdown-divider { border-color: rgba(255,255,255,.12); }
  .navbar .btn-dfe { width: 100%; margin-top: .35rem; }

  /* Prevent common wide components from pushing the page viewport sideways. */
  .table-responsive, .anchor-nav, .sim-pipeline, .arch-flow { max-width: 100%; }
  .fleet-map, .hardware-visual, .freeze-equipment { width: 100%; }
}

/* iOS zooms form controls below 16px and often leaves the page enlarged after focus. */
@media (max-width: 767.98px) {
  input, select, textarea,
  .form-control, .form-select,
  .sim-live-fields .form-control,
  .sim-number-control .form-control,
  .newsletter-fields .form-control {
    font-size: 16px !important;
  }
}

/* New pulse visual: digital event source + signal path, no clock/dial geometry. */
.pulse-source-card {
  border-radius: 1rem;
  padding: 1rem;
  background: linear-gradient(180deg,#f8fafb,#eef3f6);
  border: 1px solid #d4dfe5;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.pulse-source-counter {
  margin-top: .65rem;
  border-radius: .6rem;
  padding: .72rem .85rem;
  background: #172128;
  color: #f5f8fa;
  text-align: center;
  font: 800 clamp(1.55rem,4vw,2.2rem) 'Inter', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: .08em !important;
  font-variant-numeric: tabular-nums;
}
.pulse-source-label { margin-top:.35rem; color:#6b7f89; font-size:.68rem; text-align:center; }
.pulse-signal-path {
  display: grid;
  grid-template-columns: 78px minmax(0,1fr) 78px;
  align-items: center;
  gap: .6rem;
  margin: 1.1rem 0;
  min-width: 0;
}
.pulse-endpoint {
  min-height: 74px;
  border-radius: .72rem;
  border: 1px solid #c6d7e0;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  text-align: center;
  color: #2c5a72;
  font: 750 .6rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.pulse-endpoint i { color: var(--dfe-blue); font-size:1rem; }
.pulse-endpoint.destination { background:#eaf4fb; border-color:#bedced; }
.pulse-wire { position:relative; height:74px; min-width:0; display:flex; align-items:center; }
.pulse-wire::before { content:""; position:absolute; left:0; right:0; top:50%; border-top:2px solid #98b5c5; }
.pulse-event-rail {
  position:relative;
  z-index:2;
  width:100%;
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:3px;
  padding:0 4px;
}
.pulse-event-rail i { height:20px; border-radius:2px; background:#d9e4ea; border:1px solid #cad8df; transition:background .16s ease, transform .16s ease; }
.pulse-event-rail i.active { background:var(--dfe-green); border-color:#40b66e; transform:translateY(-3px); }
.pulse-packet {
  position:absolute;
  left:0;
  top:50%;
  width:12px;
  height:12px;
  margin-top:-6px;
  border-radius:50%;
  background:var(--dfe-blue-bright);
  box-shadow:0 0 0 5px rgba(43,138,212,.12),0 0 16px rgba(43,138,212,.35);
  opacity:0;
  z-index:4;
}
.pulse-packet.run { animation:pulsePacketRun .6s ease both; }
@keyframes pulsePacketRun { 0%{left:0;opacity:0} 12%{opacity:1} 100%{left:calc(100% - 12px);opacity:.95} }
.pulse-source-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; margin-top:auto; }
.pulse-source-summary>div { padding:.62rem; border-radius:.65rem; background:#fff; border:1px solid #d5e0e6; text-align:center; }
.pulse-source-summary span { display:block; color:#758994; font-size:.58rem; text-transform:uppercase; font-weight:800; }
.pulse-source-summary strong { display:block; margin-top:.12rem; color:#163f56; font-size:.86rem; }
.pulse-action-row { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; margin-top:.7rem; }

/* Static pulse guide uses a compact waveform path instead of another dial. */
.pg-output-path { margin:.65rem 0; padding:.65rem; border:1px solid #d8e3e8; border-radius:.7rem; background:#f7fafb; }
.pg-output-label { display:flex; align-items:center; justify-content:center; gap:.35rem; color:#225a78; font:800 .58rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.pg-output-wave { display:flex; align-items:center; justify-content:center; gap:5px; height:38px; margin:.35rem 0; }
.pg-output-wave i { width:12px; height:10px; background:#c9dbe5; border-radius:2px; }
.pg-output-wave i:nth-child(2),.pg-output-wave i:nth-child(4) { height:28px; background:var(--dfe-blue); }
.pg-output-event { display:block; text-align:center; color:#328455; font-size:.62rem; font-weight:800; }

/* Suggested next pages make long mobile pages feel intentionally connected. */
.next-pages { padding: 3.7rem 0; background:#fff; border-top:1px solid #e0e8ec; }
.next-pages.bg-soft { background:var(--dfe-sand); }
.next-pages-head { display:flex; justify-content:space-between; align-items:flex-end; gap:2rem; margin-bottom:1.25rem; }
.next-pages-head h2 { margin:0; font-size:clamp(1.55rem,3vw,2.35rem); }
.next-pages-head p { max-width:520px; margin:0; font-size:.9rem; }
.next-pages-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.85rem; }
.next-page-card {
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:.8rem;
  padding:1rem;
  border:1px solid #d7e3e9;
  border-radius:.9rem;
  background:#fff;
  text-decoration:none;
  box-shadow:0 8px 25px rgba(7,35,53,.045);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.next-page-card:hover { transform:translateY(-2px); border-color:#9ec8e1; box-shadow:0 14px 34px rgba(7,35,53,.08); }
.next-page-icon { width:42px; height:42px; border-radius:.72rem; display:grid; place-items:center; background:var(--dfe-blue-soft); color:var(--dfe-blue-deep); }
.next-page-copy { min-width:0; }
.next-page-copy strong { display:block; color:#153d53; line-height:1.25; }
.next-page-copy small { display:block; margin-top:.25rem; color:#6a7d88; line-height:1.35; }
.next-page-arrow { color:#7ba8c2; }

.back-to-top {
  position:fixed;
  right:max(16px,env(safe-area-inset-right));
  bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px));
  z-index:1040;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  background:rgba(6,31,48,.92);
  color:#fff;
  box-shadow:0 10px 28px rgba(0,0,0,.22);
  display:grid;
  place-items:center;
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease,background .18s ease;
}
.back-to-top.show { opacity:1; visibility:visible; transform:translateY(0); }
.back-to-top:hover { background:var(--dfe-blue); }

@media (max-width: 991.98px) {
  .next-pages-grid { grid-template-columns:1fr; }
  .next-pages-head { align-items:flex-start; flex-direction:column; gap:.55rem; }
}
@media (max-width: 575.98px) {
  .pulse-signal-path { grid-template-columns:62px minmax(0,1fr) 62px; gap:.35rem; }
  .pulse-endpoint { min-height:64px; font-size:.53rem; }
  .pulse-event-rail { gap:2px; }
  .pulse-source-summary { grid-template-columns:1fr 1fr; }
  .pulse-source-summary>div:last-child { grid-column:1/-1; }
  .pulse-action-row { grid-template-columns:1fr; }
  .next-pages { padding:3rem 0; }
  .next-page-card { grid-template-columns:auto minmax(0,1fr); }
  .next-page-arrow { display:none; }
  .back-to-top { width:40px; height:40px; }
}
@media (prefers-reduced-motion: reduce) {
  .pulse-packet.run { animation:none!important; opacity:1; left:calc(100% - 12px); }
  .back-to-top,.next-page-card { transition:none; }
}

/* v13.6 Insights landing */
.insights-landing-hero { padding-bottom: 5rem; }
.insights-promise {
  display:flex; gap:1rem; align-items:center; padding:1.15rem;
  border:1px solid rgba(126,197,240,.22); border-radius:1rem;
  background:rgba(4,21,33,.42); color:#d8e9f3;
}
.insights-promise-icon {
  width:44px; height:44px; flex:0 0 44px; display:flex; align-items:center; justify-content:center; align-self:center; line-height:0;
  border-radius:.8rem; color:#fff; background:rgba(43,138,212,.22); border:1px solid rgba(126,197,240,.2);
}
.insights-promise-icon i { display:flex; align-items:center; justify-content:center; width:100%; height:100%; line-height:1; font-size:1rem; margin:0; }
.insights-promise strong { display:block; color:#fff; margin-bottom:.3rem; font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
.insights-promise span { display:block; font-size:.9rem; line-height:1.55; }
.section-heading-row { display:flex; justify-content:space-between; align-items:end; gap:2rem; margin-bottom:1.7rem; }
.section-heading-row>p { max-width:590px; margin:0; color:var(--dfe-muted); }
.insights-featured {
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); overflow:hidden;
  border:1px solid #cfdee6; border-radius:1.3rem; background:#fff; box-shadow:0 18px 50px rgba(6,31,47,.08);
}
.insights-featured-copy { padding:clamp(1.6rem,4vw,3.25rem); align-self:center; }
.insights-featured-copy h2 { font-size:clamp(1.8rem,3vw,3rem); margin:.4rem 0 1rem; }
.insights-featured-copy h2 a { color:#123f5b; }
.insights-featured-copy p { color:#5a7381; font-size:1.05rem; max-width:65ch; }
.insights-featured-visual { min-height:360px; background:linear-gradient(135deg,#071b2a,#0b527e); }
.insights-featured-visual img { width:100%; height:100%; min-height:360px; object-fit:cover; }
.insights-featured-placeholder { height:100%; min-height:360px; display:grid; place-items:center; align-content:center; gap:1rem; color:#9ed6f7; }
.insights-featured-placeholder i { font-size:4rem; }
.insights-featured-placeholder span { font:800 .78rem 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.insights-path-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.insights-path {
  display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:start; padding:1.25rem;
  background:#fff; border:1px solid #d6e3e9; border-radius:1rem; color:inherit; text-decoration:none;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.insights-path:hover { transform:translateY(-2px); border-color:#8fc4e3; box-shadow:0 12px 30px rgba(7,49,75,.08); }
.insights-path-icon { width:44px;height:44px;border-radius:.75rem;display:grid;place-items:center;background:#e9f5fc;color:var(--dfe-blue); }
.insights-path h3 { font-size:1.05rem; margin:.28rem 0 .5rem; color:#173f56; }
.insights-path p { color:#667d89; font-size:.88rem; margin:0; }
.insights-path>.fa-arrow-right { color:#77a8c4; margin-top:.4rem; }
@media(max-width:991.98px){
  .insights-featured { grid-template-columns:1fr; }
  .insights-featured-visual,.insights-featured-visual img,.insights-featured-placeholder { min-height:260px; }
  .insights-path-grid { grid-template-columns:1fr; }
  .section-heading-row { align-items:flex-start; flex-direction:column; gap:.7rem; }
}

/* ==========================================================
   v13.10.1 SIMULATOR TERMINAL HEIGHT SYNC
   On desktop, let the runtime terminal grow with the controls
   column so opening the live-alert details expands both panes.
   ========================================================== */
@media (min-width: 992px) {
  .sim-runtime {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  .sim-runtime .sim-pipeline {
    flex: 0 0 auto;
  }

  .sim-runtime .sim-terminal {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .sim-runtime .sim-terminal .alert-terminal-topbar,
  .sim-runtime .sim-terminal .alert-terminal-footer {
    flex: 0 0 auto;
  }

  .sim-runtime .sim-terminal .alert-terminal-stage {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .sim-runtime .sim-terminal .alert-terminal-label,
  .sim-runtime .sim-terminal .alert-terminal-cursor {
    flex: 0 0 auto;
  }

  .sim-runtime .sim-terminal .alert-terminal-output {
    flex: 1 1 auto;
    height: auto;
    min-height: 390px;
  }
}