/* SignalFront marketing: emerald accents, neutral reading surfaces.
   Keep section and diagram colours independent of risk/status semantics. */
:root {
  --sf-brand-deep: #005326;
  --sf-brand-bright: #32E875;
  --sf-example-surface: #FFFFFF;
}
html[data-theme="dark"] { --sf-example-surface: #1A3025; }
.site-header { border-bottom-color: transparent; }
.site-footer .brand svg { color: var(--sf-brand-bright); }
.dark { background: var(--sf-brand-deep); }
.dark .eyebrow, .dark .people-platform > div > span { color: var(--sf-brand-bright); }
.dark p, .dark .sf-editorial-intro > p:not(.eyebrow) { color: #D7EAE1; }
.dark .people-platform > div, .dark .people-conclusion { border-color: #468771; }
.sf-operating-context .sf-value-row { gap: 20px; margin-top: 26px; }
.sf-operating-context .sf-value-row article { border: 0; border-radius: 5px; padding: 28px; background: var(--cloud); }
.sf-operating-context .sf-value-row h3 { font-size: 23px; max-width: 290px; }
.sf-operating-context .sf-value-row p { margin-top: 15px; }
.sf-pilot-entry { background: var(--visual-surface); }
.sf-client-questions { display: grid; gap: 18px; }
.sf-client-questions article { border: 0; background: var(--cloud); padding: 28px; border-radius: 5px; }

/* A concrete service example links the shared evidence to both risk views. */
.sf-risk-example { max-width: 1000px; margin: 58px auto 0; }
.sf-risk-example figure { margin: 0; }
.sf-example-context {
  display: grid; grid-template-columns: 1.25fr 1fr; gap: 38px;
  align-items: center; padding: 30px 34px; border-radius: 5px;
  background: var(--sf-brand-deep); color: white;
}
.sf-example-context span { display: block; color: var(--sf-brand-bright); font-size: 14px; margin-bottom: 12px; }
.sf-example-context h3 { font-size: 28px; line-height: 1.18; max-width: 440px; }
.sf-example-context p { font-size: 17px; line-height: 1.6; color: #E0F0E7; }
.sf-example-branch { position: relative; width: 52%; height: 29px; margin: 0 auto 25px; border-bottom: 1px solid var(--blue); }
.sf-example-branch::before { content: ''; position: absolute; left: 50%; height: 29px; border-left: 1px solid var(--blue); }
.sf-example-branch::after { content: ''; position: absolute; inset: 29px -1px auto; height: 25px; border-left: 1px solid var(--blue); border-right: 1px solid var(--blue); }
.sf-example-lenses { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.sf-example-lenses section { padding: 28px 32px; border-radius: 5px; background: var(--sf-example-surface); }
.sf-example-lenses span { color: var(--blue); font-size: 14px; font-weight: 500; }
.sf-example-lenses h4 { font-size: 25px; font-weight: 500; letter-spacing: -.02em; line-height: 1.25; margin-top: 12px; }
.sf-example-lenses p { font-size: 17px; color: var(--slate); line-height: 1.65; margin-top: 16px; }
.sf-risk-example figcaption { font-size: 16px; line-height: 1.65; color: var(--slate); max-width: 800px; margin: 23px 0; }
.sf-risk-example > .text-link { display: inline-block; }

/* Keep the order visible at every width; the final step returns to evidence. */
.sf-evidence-loop { margin: 44px 0 0; }
.sf-evidence-loop ol { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.sf-evidence-loop li { margin: 0; padding: 26px 28px; background: var(--cloud); border-radius: 5px; min-width: 0; }
.sf-evidence-loop li > span { display: inline-grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--blue); border-radius: 50%; color: var(--blue); font-size: 13px; margin-bottom: 22px; }
.sf-evidence-loop li:first-child > span, .sf-evidence-loop li:last-child > span { background: var(--action); color: white; border-color: var(--action); }
.sf-evidence-loop h3 { font-size: 24px; line-height: 1.25; }
.sf-evidence-loop p { font-size: 17px; color: var(--slate); line-height: 1.6; margin-top: 14px; }
.sf-evidence-loop figcaption { display: flex; align-items: center; gap: 15px; margin-top: 26px; font-size: 16px; color: var(--slate); }
.sf-evidence-loop figcaption svg { width: 38px; height: 32px; flex-shrink: 0; fill: none; stroke: var(--blue); stroke-width: 1.5; }
html[data-theme="dark"] .sf-operating-context .sf-value-row article { background: #1A3025; }
html[data-theme="dark"] .sf-evidence-loop li { background: #1A3025; }
html[data-theme="dark"] .sf-example-context { background: #005326; }

@media (max-width: 960px) {
  .sf-operating-context .sf-value-row article { padding: 24px; }
  .sf-example-context { gap: 26px; }
  .sf-example-lenses section { padding: 25px; }
  .sf-evidence-loop ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .sf-operating-context .sf-value-row { gap: 14px; }
  .sf-operating-context .sf-value-row h3 { font-size: 24px; max-width: 340px; }
  .sf-client-questions article { padding: 24px; }
  .sf-risk-example { margin-top: 36px; }
  .sf-example-context { grid-template-columns: 1fr; gap: 19px; padding: 25px; }
  .sf-example-context h3 { font-size: 27px; }
  .sf-example-context p { font-size: 16px; }
  .sf-example-branch { width: 0; height: 24px; margin-bottom: 0; border-bottom: 0; }
  .sf-example-branch::before { height: 24px; }
  .sf-example-branch::after { display: none; }
  .sf-example-lenses { grid-template-columns: 1fr; gap: 14px; }
  .sf-example-lenses h4 { font-size: 25px; }
  .sf-example-lenses p { font-size: 16px; }
  .sf-risk-example figcaption { font-size: 15px; }
  .sf-evidence-loop { margin-top: 30px; }
  .sf-evidence-loop ol { grid-template-columns: 1fr; gap: 12px; }
  .sf-evidence-loop li { padding: 23px 24px 23px 76px; position: relative; }
  .sf-evidence-loop li > span { position: absolute; top: 22px; left: 23px; margin: 0; }
  .sf-evidence-loop h3 { font-size: 24px; }
  .sf-evidence-loop p { font-size: 16px; margin-top: 10px; }
  .sf-evidence-loop figcaption { font-size: 15px; align-items: flex-start; }
}

/* Risk gaps lead; deployment remains available as engineering detail. */
.sf-gap-heading { margin-top: 48px; font-size: clamp(29px, 3vw, 40px); line-height: 1.15; letter-spacing: -.025em; }
#risk-gaps { scroll-margin-top: 100px; }
.sf-deployment-details { background: var(--sf-example-surface); border-radius: 5px; padding: 0 28px; }
.sf-deployment-details > summary { cursor: pointer; padding: 26px 0; font-size: 24px; font-weight: 500; color: var(--ink); }
.sf-deployment-details > summary span { display: block; margin-top: 9px; font-size: 16px; font-weight: 400; line-height: 1.5; color: var(--slate); }
.sf-deployment-details > summary:focus-visible { outline: 2px solid var(--blue); outline-offset: 6px; }
.sf-deployment-details[open] > summary { margin-bottom: 14px; }
.sf-deployment-details .sf-architecture { margin-top: 0; }
.sf-deployment-boundary { padding: 24px 0 30px; max-width: 760px; }
.sf-deployment-boundary h2 { font-size: 25px; }
.sf-deployment-boundary p { font-size: 17px; line-height: 1.6; color: var(--slate); margin-top: 16px; }
@media (max-width:640px) {
  .sf-gap-heading { margin-top: 34px; }
  .sf-deployment-details { padding: 0 18px; }
  .sf-deployment-details > summary { font-size: 22px; }
  .sf-deployment-details > summary span { font-size: 15px; }
}

/* Two source paths into the platform: local collection and direct cloud. */
.sf-source-paths { display:grid; grid-template-columns:1fr 1fr; gap:28px; }
.sf-local-source, .sf-cloud-source { display:flex; flex-direction:column; min-width:0; }
.sf-local-source .sf-client-boundary { flex:1; }
.sf-cloud-source-card { flex:1; border:1px solid var(--line-strong); border-radius:8px; padding:28px; background:var(--visual-surface); }
.sf-cloud-source-card > span { display:block; font-size:14px; color:var(--slate); margin-bottom:24px; }
.sf-cloud-source-card h3 { font-size:27px; line-height:1.2; margin-bottom:20px; }
.sf-cloud-source-card p { font-size:17px; line-height:1.6; color:var(--slate); margin-top:16px; }
.sf-local-source .sf-outbound, .sf-direct-source { display:flex; flex-direction:column; gap:8px; text-align:center; padding:22px 10px 14px; }
.sf-local-source .sf-outbound svg { display:none; }
.sf-direct-source strong { color:var(--blue); font-size:15px; font-weight:500; }
.sf-direct-source span { color:var(--slate); font-size:13px; line-height:1.5; }
.sf-source-join svg { display:block; width:100%; height:48px; fill:none; stroke:var(--blue); stroke-width:1.5; }
.sf-connected-sources > .sf-platform-box { max-width:760px; margin:0 auto; }
@media(max-width:800px) {
 .sf-source-paths { grid-template-columns:1fr; gap:24px; padding-right:22px; position:relative; }
 .sf-source-paths::after { content:''; position:absolute; right:0; top:50%; bottom:-24px; border-right:1.5px solid var(--blue); }
 .sf-local-source, .sf-cloud-source { position:relative; }
 .sf-local-source::after, .sf-cloud-source::after { content:''; position:absolute; right:-22px; bottom:24px; width:22px; border-top:1.5px solid var(--blue); }
 .sf-source-paths::after { top:0; }
 .sf-source-join { height:25px; margin:24px 0 0 50%; border-top:1.5px solid var(--blue); border-left:1.5px solid var(--blue); }
 .sf-source-join svg { display:none; }
 .sf-cloud-source-card { padding:24px; }
 .sf-cloud-source-card h3 { font-size:24px; }
}