:root {
  --navy: #0c1c2a;
  --navy-2: #132b3d;
  --navy-3: #1a3a50;
  --orange: #e37e2e;
  --orange-2: #f29242;
  --orange-soft: #fff0e4;
  --mist: #dde1e2;
  --mist-2: #eef1f2;
  --paper: #f8f9f9;
  --white: #ffffff;
  --ink: #182832;
  --muted: #687780;
  --line: #d9dfe2;
  --shadow: 0 24px 70px rgba(12, 28, 42, .12);
  --radius: 26px;
  --radius-sm: 16px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: "Manrope", Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.modal-open { overflow: hidden; }
button, input, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
svg { display: block; }

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

.container { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.section-pad { padding: 120px 0; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(248, 249, 249, .92);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(12, 28, 42, .08);
  transition: box-shadow .25s ease, background .25s ease;
}
.site-header.scrolled { box-shadow: 0 10px 30px rgba(12, 28, 42, .08); background: rgba(255,255,255,.94); }
.nav-wrap { height: 82px; display: flex; align-items: center; gap: 34px; }
.brand { display: inline-flex; align-items: center; width: 146px; flex: 0 0 146px; overflow: hidden; }
.brand img { width: 146px; height: 54px; object-fit: cover; object-position: center; border-radius: 4px; }
.primary-nav { display: flex; gap: 30px; align-items: center; margin-left: auto; }
.primary-nav a { font-size: 14px; font-weight: 700; color: #31434f; position: relative; }
.primary-nav a::after { content: ""; position: absolute; left: 0; bottom: -8px; width: 0; height: 2px; background: var(--orange); transition: width .2s ease; }
.primary-nav a:hover::after { width: 100%; }
.nav-actions { display: flex; align-items: center; gap: 18px; }
.text-link { font-size: 14px; font-weight: 700; color: var(--navy); }
.menu-toggle { display: none; border: 0; background: none; padding: 8px; margin-left: auto; }
.menu-toggle > span:not(.sr-only) { display: block; width: 25px; height: 2px; background: var(--navy); margin: 5px 0; transition: .2s ease; }

.btn {
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 12px 20px;
  font-weight: 800;
  font-size: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-primary { color: var(--white); background: var(--orange); box-shadow: 0 10px 24px rgba(227, 126, 46, .2); }
.btn-primary:hover { background: #d86f1f; box-shadow: 0 14px 30px rgba(227, 126, 46, .28); }
.btn-secondary { color: var(--navy); border-color: #cbd3d6; background: rgba(255,255,255,.7); }
.btn-secondary:hover { border-color: var(--navy); background: #fff; }
.btn-light { background: white; color: var(--navy); }
.btn-lg { padding: 15px 24px; font-size: 15px; }

.hero { position: relative; overflow: hidden; min-height: 760px; display: flex; align-items: center; background: linear-gradient(180deg, #f8f9f9 0%, #f2f5f5 100%); }
.hero::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(12,28,42,.09) .75px, transparent .75px); background-size: 24px 24px; mask-image: linear-gradient(to bottom, rgba(0,0,0,.5), transparent 72%); opacity: .45; pointer-events: none; }
.hero-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 62px; align-items: center; position: relative; z-index: 2; }
.hero-copy { padding: 34px 0; }
.eyebrow { text-transform: uppercase; letter-spacing: .14em; font-size: 11px; font-weight: 800; color: #52626c; display: inline-flex; align-items: center; gap: 9px; }
.eyebrow > span { width: 23px; height: 2px; background: var(--orange); display: inline-block; }
.eyebrow-light { color: #81919b; }
.eyebrow-dark { color: rgba(255,255,255,.64); }
.hero h1, .section-heading h2, .assistant-copy h2, .solutions-head h2, .security-copy h2, .faq-intro h2, .final-cta h2 {
  margin: 22px 0 24px;
  color: var(--navy);
  letter-spacing: -.055em;
  line-height: .98;
  font-weight: 700;
}
.hero h1 { font-size: clamp(54px, 6.2vw, 88px); }
h1 em, h2 em { font-style: normal; color: var(--orange); }
.hero-lede { font-size: 18px; line-height: 1.75; color: #52636e; max-width: 650px; margin: 0; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.hero-proof { display: flex; align-items: center; gap: 14px; margin-top: 38px; padding-top: 28px; border-top: 1px solid #d7dddf; max-width: 620px; }
.proof-mark { width: 36px; height: 36px; border: 1px solid #c8d0d3; border-radius: 50%; display: grid; place-items: center; color: var(--orange); font-weight: 800; }
.hero-proof p { margin: 0; color: #67757e; font-size: 13px; line-height: 1.55; }
.hero-orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(227,126,46,.18); pointer-events: none; }
.hero-orbit-one { width: 580px; height: 580px; right: -250px; top: -190px; }
.hero-orbit-two { width: 820px; height: 820px; right: -430px; top: -310px; border-color: rgba(12,28,42,.08); }

.product-stage { position: relative; padding: 12px; border: 1px solid rgba(12,28,42,.1); border-radius: 25px; background: rgba(255,255,255,.74); box-shadow: var(--shadow); min-width: 0; }
.stage-glow { position: absolute; width: 290px; height: 290px; border-radius: 50%; background: rgba(227,126,46,.18); filter: blur(80px); right: -55px; top: -55px; z-index: -1; }
.window-bar { min-height: 42px; display: flex; align-items: center; gap: 12px; padding: 0 6px 10px; color: #7a878e; font-size: 10px; font-weight: 700; }
.window-dots { display: flex; gap: 5px; }
.window-dots span { width: 7px; height: 7px; background: #cfd6d8; border-radius: 50%; }
.window-title { margin: 0 auto; }
.live-pill { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 999px; background: #edf7f0; color: #447256; }
.live-pill i { width: 5px; height: 5px; border-radius: 50%; background: #4b9f66; box-shadow: 0 0 0 4px rgba(75,159,102,.12); }
.product-shell { min-height: 530px; background: #f5f7f7; border-radius: 18px; overflow: hidden; display: flex; border: 1px solid #e5e9ea; }
.product-sidebar { width: 54px; background: var(--navy); padding: 18px 12px; display: flex; flex-direction: column; align-items: center; gap: 15px; }
.mini-brand { width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.18); color: var(--orange-2); display: grid; place-items: center; border-radius: 50%; font-size: 12px; font-weight: 800; margin-bottom: 14px; }
.sidebar-dot { width: 26px; height: 26px; border: 0; background: transparent; border-radius: 8px; position: relative; }
.sidebar-dot::after { content: ""; position: absolute; width: 8px; height: 8px; border: 1.5px solid #7d929f; border-radius: 2px; inset: 0; margin: auto; }
.sidebar-dot.active { background: rgba(227,126,46,.13); }
.sidebar-dot.active::after { border-color: var(--orange); }
.sidebar-spacer { flex: 1; }
.product-main { flex: 1; padding: 28px; min-width: 0; }
.product-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.product-kicker { color: #87939a; text-transform: uppercase; letter-spacing: .12em; font-size: 8px; font-weight: 800; }
.product-head h2 { margin: 5px 0 0; color: var(--navy); font-size: 21px; letter-spacing: -.04em; }
.illustrative { font-size: 8px; padding: 5px 8px; background: #edf0f1; color: #7b8991; border-radius: 6px; }
.metric-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 20px; }
.metric-card { border: 1px solid #e0e5e7; border-radius: 12px; background: #fff; padding: 15px; }
.metric-card > span { font-size: 8px; font-weight: 800; color: #87949b; text-transform: uppercase; letter-spacing: .08em; }
.metric-card strong { display: block; margin: 7px 0 5px; font-size: 19px; color: var(--navy); letter-spacing: -.04em; }
.metric-card:first-child strong { color: var(--orange); }
.metric-card small { font-size: 8px; color: #7c8a91; }
.dot-orange { width: 5px; height: 5px; background: var(--orange); border-radius: 50%; display: inline-block; margin-right: 4px; }
.dashboard-grid { display: grid; grid-template-columns: 1.45fr .8fr; gap: 10px; margin-top: 10px; }
.chart-card, .assistant-card { border: 1px solid #e0e5e7; border-radius: 13px; background: #fff; }
.chart-card { padding: 15px 15px 11px; min-width: 0; }
.card-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.card-head span { color: #8a969c; font-size: 8px; display: block; }
.card-head strong { display: block; font-size: 11px; color: var(--navy); margin-top: 2px; }
.status-up { color: var(--orange) !important; font-weight: 800; }
.risk-chart { width: 100%; margin-top: 16px; overflow: visible; }
.risk-chart .grid-lines line { stroke: #e8ecee; stroke-width: 1; }
.risk-chart .line { fill: none; stroke: var(--orange); stroke-width: 3; stroke-linecap: round; }
.risk-chart .fill { fill: url(#riskFill); }
.risk-chart circle { fill: #fff; stroke: var(--orange); stroke-width: 3; }
.chart-labels { display: flex; justify-content: space-between; color: #9ba5aa; font-size: 7px; margin-top: 5px; }
.assistant-card { padding: 16px; display: flex; flex-direction: column; }
.assistant-head { display: flex; align-items: center; gap: 9px; }
.ai-icon { width: 28px; height: 28px; border-radius: 8px; background: var(--navy); color: var(--orange-2); display: grid; place-items: center; font-size: 12px; box-shadow: 0 8px 18px rgba(12,28,42,.12); }
.assistant-head span { color: #8b969c; font-size: 7px; display: block; }
.assistant-head strong { color: var(--navy); font-size: 10px; display: block; margin-top: 2px; }
.assistant-card p { font-size: 9px; line-height: 1.65; color: #5f6d75; margin: 16px 0 12px; }
.assistant-source { font-size: 7px; line-height: 1.5; color: #88959b; padding: 9px; border-radius: 8px; background: #f5f7f7; }
.assistant-source span { color: var(--orange); font-weight: 800; }
.ask-btn { margin-top: auto; border: 0; background: none; padding: 13px 0 0; color: var(--navy); font-size: 8px; font-weight: 800; text-align: left; }
.ask-btn span { float: right; color: var(--orange); }

.signal-strip { background: var(--navy); color: white; border-top: 1px solid rgba(255,255,255,.08); }
.signal-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.signal-grid > div { padding: 28px 22px; border-right: 1px solid rgba(255,255,255,.1); }
.signal-grid > div:first-child { border-left: 1px solid rgba(255,255,255,.1); }
.signal-grid span { display: block; color: #8fa1ad; text-transform: uppercase; letter-spacing: .1em; font-size: 9px; font-weight: 800; }
.signal-grid strong { display: block; margin-top: 6px; font-size: 15px; font-weight: 700; }

.platform { background: var(--navy); color: white; }
.section-heading { max-width: 900px; }
.section-heading h2, .security-copy h2, .final-cta h2 { color: white; font-size: clamp(42px, 5vw, 68px); }
.section-heading > p { color: #9aabb5; font-size: 17px; line-height: 1.8; max-width: 760px; }
.section-heading.centered { text-align: center; margin: 0 auto 50px; }
.section-heading.centered .eyebrow { justify-content: center; }
.feature-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 54px; }
.feature-card { position: relative; min-height: 330px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.035); border-radius: var(--radius); padding: 32px; overflow: hidden; transition: transform .25s ease, border-color .25s ease, background .25s ease; }
.feature-card:hover { transform: translateY(-5px); border-color: rgba(227,126,46,.5); background: rgba(255,255,255,.055); }
.feature-card-wide { min-height: 365px; }
.feature-number { color: #667a87; font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.feature-icon { width: 54px; height: 54px; border-radius: 15px; display: grid; place-items: center; background: rgba(227,126,46,.12); margin: 28px 0 34px; }
.feature-icon svg { width: 28px; height: 28px; fill: none; stroke: var(--orange-2); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.feature-card h3 { font-size: 25px; margin: 0 0 12px; letter-spacing: -.035em; }
.feature-card p { color: #93a5af; line-height: 1.75; margin: 0; max-width: 510px; font-size: 14px; }
.mini-visual { position: absolute; right: 30px; bottom: 30px; width: 34%; }
.bars { display: flex; flex-direction: column; gap: 7px; }
.bars span { display: block; width: var(--w); height: 5px; border-radius: 999px; margin-left: auto; background: linear-gradient(90deg, rgba(227,126,46,.18), var(--orange)); }
.mini-events { position: absolute; right: 28px; bottom: 28px; display: flex; flex-direction: column; gap: 7px; width: 42%; }
.mini-events span { font-size: 9px; color: #98a8b1; padding: 9px 10px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; background: rgba(0,0,0,.08); }
.mini-events i { width: 6px; height: 6px; border-radius: 50%; background: var(--orange); display: inline-block; margin-right: 7px; }

.assistant-section { background: #f2f4f4; }
.assistant-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 78px; align-items: center; }
.assistant-copy h2, .solutions-head h2, .faq-intro h2 { font-size: clamp(42px, 4.5vw, 66px); }
.assistant-copy > p { color: #65747d; line-height: 1.8; font-size: 16px; }
.check-list { margin-top: 34px; border-top: 1px solid #d7dddf; }
.check-list > div { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 20px 0; border-bottom: 1px solid #d7dddf; }
.check-list > div > span { color: var(--orange); font-size: 10px; font-weight: 800; padding-top: 3px; }
.check-list p { margin: 0; color: #687780; font-size: 13px; line-height: 1.65; }
.check-list strong { color: var(--navy); }

.chat-panel { background: white; border-radius: 26px; border: 1px solid #dfe4e6; box-shadow: var(--shadow); overflow: hidden; }
.chat-top { padding: 18px 22px; border-bottom: 1px solid #e5e9ea; display: flex; justify-content: space-between; align-items: center; }
.chat-top .assistant-head span { font-size: 9px; }
.chat-top .assistant-head strong { font-size: 12px; }
.secure-pill { font-size: 9px; color: #647780; background: #f2f5f5; border-radius: 999px; padding: 6px 9px; font-weight: 700; }
.chat-body { min-height: 330px; padding: 32px 28px 22px; background: linear-gradient(180deg,#fbfcfc,#f6f8f8); }
.chat-date { text-align: center; color: #9aa5aa; font-size: 8px; letter-spacing: .13em; font-weight: 800; margin-bottom: 24px; }
.message { max-width: 82%; border-radius: 16px; padding: 14px 16px; font-size: 13px; line-height: 1.6; margin-bottom: 16px; }
.user-message { margin-left: auto; background: var(--navy); color: white; border-bottom-right-radius: 4px; }
.ai-message { display: flex; gap: 12px; background: white; border: 1px solid #e1e6e7; box-shadow: 0 8px 18px rgba(12,28,42,.05); border-bottom-left-radius: 4px; }
.ai-mini { width: 25px; height: 25px; flex: 0 0 25px; background: var(--orange-soft); color: var(--orange); border-radius: 7px; display: grid; place-items: center; font-size: 11px; }
.ai-message p { margin: 0; color: #4e606b; }
.source-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 13px; }
.source-chips span { padding: 5px 7px; border-radius: 6px; background: #f1f4f4; color: #73828a; font-size: 8px; font-weight: 800; }
.prompt-suggestions { padding: 13px 22px 0; display: flex; flex-wrap: wrap; gap: 7px; background: white; }
.prompt-suggestions button { border: 1px solid #dfe5e7; background: white; border-radius: 999px; padding: 8px 10px; color: #5e6f78; font-size: 9px; font-weight: 700; }
.prompt-suggestions button:hover { border-color: var(--orange); color: var(--orange); }
.chat-input { margin: 14px 22px 22px; border: 1px solid #d9e0e2; border-radius: 13px; display: flex; align-items: center; justify-content: space-between; color: #9aa5ab; padding: 11px 12px 11px 15px; font-size: 11px; }
.chat-input button { width: 31px; height: 31px; border-radius: 9px; border: 0; background: var(--orange); color: white; font-weight: 800; }

.workflow { background: var(--navy); color: white; }
.workflow-shell { border: 1px solid rgba(255,255,255,.12); border-radius: 26px; overflow: hidden; background: rgba(255,255,255,.03); }
.workflow-tabs { display: grid; grid-template-columns: repeat(4,1fr); border-bottom: 1px solid rgba(255,255,255,.12); }
.workflow-tab { border: 0; border-right: 1px solid rgba(255,255,255,.1); background: transparent; color: #8fa2ad; padding: 20px; font-weight: 700; font-size: 13px; text-align: left; transition: background .2s ease, color .2s ease; }
.workflow-tab:last-child { border-right: 0; }
.workflow-tab span { color: #607784; font-size: 9px; display: block; margin-bottom: 7px; }
.workflow-tab.active { background: rgba(227,126,46,.1); color: white; box-shadow: inset 0 -2px 0 var(--orange); }
.workflow-tab.active span { color: var(--orange); }
.workflow-content { min-height: 410px; display: grid; grid-template-columns: .85fr 1.15fr; }
.workflow-copy-block { padding: 52px; }
.workflow-kicker { color: var(--orange); letter-spacing: .15em; font-size: 9px; font-weight: 800; }
.workflow-copy-block h3 { font-size: 34px; letter-spacing: -.045em; line-height: 1.12; margin: 17px 0; max-width: 460px; }
.workflow-copy-block p { color: #93a6b1; font-size: 14px; line-height: 1.7; max-width: 460px; }
.workflow-copy-block ul { margin: 26px 0 0; padding: 0; list-style: none; }
.workflow-copy-block li { color: #b7c2c8; font-size: 12px; margin: 10px 0; padding-left: 20px; position: relative; }
.workflow-copy-block li::before { content: ""; width: 6px; height: 6px; background: var(--orange); border-radius: 50%; position: absolute; left: 0; top: 6px; }
.workflow-visual { border-left: 1px solid rgba(255,255,255,.1); padding: 44px; background: radial-gradient(circle at 60% 30%, rgba(227,126,46,.11), transparent 42%); display: grid; place-items: center; }
.risk-feed-card { width: min(100%, 540px); background: #f8f9f9; border-radius: 18px; padding: 19px; box-shadow: 0 30px 70px rgba(0,0,0,.18); }
.feed-head { display: flex; justify-content: space-between; color: var(--navy); padding: 0 3px 13px; font-size: 11px; }
.feed-head span { color: #8e999f; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }
.feed-item { display: grid; grid-template-columns: 11px 1fr auto; gap: 10px; align-items: center; padding: 14px 10px; border-top: 1px solid #e4e8ea; }
.feed-item i { width: 7px; height: 7px; border-radius: 50%; background: #9caaaf; }
.feed-item.high i { background: var(--orange); box-shadow: 0 0 0 5px rgba(227,126,46,.1); }
.feed-item.medium i { background: #cc9e54; }
.feed-item strong { color: #2d3f4a; font-size: 9px; display: block; }
.feed-item span { color: #8e999f; font-size: 7px; display: block; margin-top: 3px; }
.feed-item b { font-size: 7px; color: #6b7c85; padding: 5px 7px; background: #edf1f2; border-radius: 6px; }
.feed-item.high b { color: var(--orange); background: var(--orange-soft); }

.solutions { background: #f6f7f7; }
.solutions-head { display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; align-items: end; }
.solutions-head h2 { margin-bottom: 0; }
.solutions-head > p { color: #697880; line-height: 1.8; font-size: 15px; margin: 0 0 8px; }
.solution-list { margin-top: 60px; border-top: 1px solid #d6dddf; }
.solution-row { display: grid; grid-template-columns: 60px 1.3fr 1fr 36px; gap: 30px; align-items: center; padding: 28px 0; border-bottom: 1px solid #d6dddf; transition: padding .2s ease, background .2s ease; }
.solution-row:hover { padding-left: 12px; padding-right: 12px; background: white; }
.solution-index { color: var(--orange); font-size: 10px; font-weight: 800; }
.solution-main h3 { margin: 0 0 6px; font-size: 22px; color: var(--navy); letter-spacing: -.035em; }
.solution-main p { margin: 0; font-size: 12px; line-height: 1.6; color: #718088; max-width: 530px; }
.solution-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.solution-tags span { padding: 6px 8px; border-radius: 999px; border: 1px solid #dbe1e3; color: #77858c; font-size: 8px; font-weight: 700; background: #fafbfb; }
.row-arrow { color: var(--orange); font-size: 20px; }

.security { background: #102536; color: white; position: relative; overflow: hidden; }
.security::after { content: ""; width: 540px; height: 540px; border: 1px solid rgba(227,126,46,.17); border-radius: 50%; position: absolute; right: -260px; bottom: -260px; box-shadow: 0 0 0 90px rgba(227,126,46,.025), 0 0 0 180px rgba(227,126,46,.02); }
.security-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 78px; align-items: center; position: relative; z-index: 2; }
.security-copy h2 { margin-top: 20px; }
.security-copy p { color: #9baeb8; line-height: 1.8; font-size: 15px; margin-bottom: 30px; }
.security-cards { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.security-cards article { min-height: 210px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; padding: 24px; background: rgba(255,255,255,.035); }
.security-icon { color: var(--orange); font-size: 23px; }
.security-cards h3 { font-size: 16px; margin: 22px 0 9px; }
.security-cards p { color: #90a3ae; font-size: 11px; line-height: 1.7; margin: 0; }

.faq { background: white; }
.faq-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; align-items: start; }
.faq-intro { position: sticky; top: 120px; }
.faq-intro > p { color: #74828a; font-size: 13px; line-height: 1.7; }
.faq-list { border-top: 1px solid #d9dfe1; }
.faq-item { border-bottom: 1px solid #d9dfe1; }
.faq-item > button { width: 100%; border: 0; background: none; display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 22px 0; text-align: left; color: var(--navy); font-weight: 700; }
.faq-item > button span { font-size: 15px; }
.faq-item > button i { width: 20px; height: 20px; position: relative; flex: 0 0 20px; }
.faq-item > button i::before, .faq-item > button i::after { content: ""; position: absolute; background: var(--orange); inset: 50% auto auto 50%; transform: translate(-50%,-50%); transition: transform .2s ease; }
.faq-item > button i::before { width: 14px; height: 1.5px; }
.faq-item > button i::after { width: 1.5px; height: 14px; }
.faq-item.active > button i::after { transform: translate(-50%,-50%) rotate(90deg); }
.faq-answer { display: none; padding: 0 45px 22px 0; }
.faq-item.active .faq-answer { display: block; }
.faq-answer p { color: #687780; line-height: 1.8; font-size: 13px; margin: 0; }

.final-cta { position: relative; overflow: hidden; background: var(--navy); color: white; padding: 90px 0; }
.final-cta-inner { display: grid; grid-template-columns: 1.2fr .8fr; gap: 80px; align-items: end; position: relative; z-index: 2; }
.final-cta h2 { margin-bottom: 0; max-width: 760px; }
.cta-actions p { color: #93a6b0; line-height: 1.7; font-size: 14px; margin: 0 0 24px; }
.cta-orbit { width: 700px; height: 700px; position: absolute; left: -390px; top: -310px; border: 1px solid rgba(227,126,46,.18); border-radius: 50%; box-shadow: 0 0 0 90px rgba(227,126,46,.025), 0 0 0 180px rgba(227,126,46,.018); }

.site-footer { background: #07131c; color: white; padding: 70px 0 28px; }
.footer-grid { display: grid; grid-template-columns: 1.5fr .7fr .7fr 1fr; gap: 56px; }
.footer-brand img { width: 142px; height: 53px; object-fit: cover; border-radius: 4px; filter: brightness(1.05); }
.footer-brand p, .footer-col p { color: #8397a3; font-size: 12px; line-height: 1.7; max-width: 310px; }
.footer-col { display: flex; flex-direction: column; align-items: flex-start; gap: 11px; }
.footer-col strong { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: #d8e0e4; margin-bottom: 6px; }
.footer-col a, .footer-link { color: #80939e; font-size: 12px; border: 0; background: none; padding: 0; }
.footer-col a:hover, .footer-link:hover { color: var(--orange-2); }
.footer-bottom { margin-top: 58px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.09); display: flex; justify-content: space-between; gap: 25px; color: #6f8490; font-size: 9px; }

.modal-backdrop { position: fixed; inset: 0; background: rgba(5,16,24,.75); backdrop-filter: blur(10px); z-index: 100; display: none; align-items: center; justify-content: center; padding: 20px; }
.modal-backdrop.open { display: flex; }
.demo-modal { width: min(920px,100%); max-height: calc(100vh - 40px); overflow: auto; background: #f7f9f9; border-radius: 26px; box-shadow: 0 30px 90px rgba(0,0,0,.35); display: grid; grid-template-columns: .9fr 1.1fr; gap: 40px; padding: 46px; position: relative; }
.modal-close { position: absolute; right: 18px; top: 15px; width: 36px; height: 36px; border-radius: 50%; border: 1px solid #d4dcde; background: white; color: var(--navy); font-size: 22px; line-height: 1; }
.modal-copy { padding: 20px 0; }
.modal-copy h2 { color: var(--navy); font-size: 42px; letter-spacing: -.05em; line-height: 1.02; margin: 20px 0; }
.modal-copy p { color: #74828a; line-height: 1.75; font-size: 13px; }
#demoForm { display: flex; flex-direction: column; gap: 13px; padding-top: 18px; }
#demoForm label { color: #53636c; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
#demoForm input, #demoForm select { width: 100%; display: block; margin-top: 6px; border: 1px solid #d5dddf; border-radius: 11px; background: white; padding: 12px 13px; outline: none; color: var(--navy); font-size: 13px; }
#demoForm input:focus, #demoForm select:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(227,126,46,.1); }
.form-note { margin: 0; color: #87959b; font-size: 9px; text-align: center; }
.form-success { display: none; margin-top: 4px; border-radius: 12px; background: #edf7f0; color: #37644a; padding: 12px 14px; font-size: 11px; line-height: 1.6; }
.form-success.show { display: block; }

.reveal { opacity: 1; transform: none; }
.js-enhanced .reveal { opacity: 0; transform: translateY(24px); transition: opacity .65s ease, transform .65s ease; }
.js-enhanced .reveal.in-view { opacity: 1; transform: translateY(0); }

@media (max-width: 1100px) {
  .primary-nav { gap: 18px; }
  .nav-actions .text-link { display: none; }
  .hero-grid { grid-template-columns: 1fr; gap: 34px; }
  .hero { padding-top: 80px; }
  .hero-copy { max-width: 820px; }
  .product-stage { max-width: 800px; }
  .assistant-layout, .security-grid { gap: 45px; }
}

@media (max-width: 900px) {
  .container { width: min(100% - 36px, 1180px); }
  .section-pad { padding: 88px 0; }
  .nav-wrap { height: 72px; }
  .primary-nav, .nav-actions { display: none; }
  .menu-toggle { display: block; }
  .site-header.menu-open .primary-nav { display: flex; position: absolute; left: 0; right: 0; top: 72px; background: white; padding: 22px 18px; flex-direction: column; align-items: flex-start; border-bottom: 1px solid #e0e5e6; box-shadow: 0 18px 30px rgba(12,28,42,.08); }
  .site-header.menu-open .primary-nav a { width: 100%; padding: 8px 0; }
  .hero h1 { font-size: clamp(52px, 10vw, 78px); }
  .feature-grid, .assistant-layout, .security-grid, .faq-grid, .solutions-head, .final-cta-inner { grid-template-columns: 1fr; }
  .assistant-layout, .security-grid, .faq-grid { gap: 50px; }
  .workflow-content { grid-template-columns: 1fr; }
  .workflow-visual { border-left: 0; border-top: 1px solid rgba(255,255,255,.1); }
  .solution-row { grid-template-columns: 45px 1fr 35px; }
  .solution-tags { display: none; }
  .security-copy { max-width: 700px; }
  .faq-intro { position: static; max-width: 650px; }
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer-col:last-child { grid-column: 1 / -1; }
  .demo-modal { grid-template-columns: 1fr; gap: 12px; padding: 35px; }
}

@media (max-width: 640px) {
  .container { width: min(100% - 28px, 1180px); }
  .section-pad { padding: 72px 0; }
  .brand { width: 124px; flex-basis: 124px; }
  .brand img { width: 124px; height: 46px; }
  .hero { min-height: 0; padding-top: 45px; }
  .hero h1 { font-size: clamp(45px, 14vw, 65px); }
  .hero-lede { font-size: 16px; }
  .hero-actions .btn { width: 100%; }
  .hero-proof { align-items: flex-start; }
  .product-stage { margin-left: -7px; margin-right: -7px; padding: 7px; }
  .window-title { display: none; }
  .product-shell { min-height: 455px; }
  .product-sidebar { width: 40px; padding-left: 7px; padding-right: 7px; }
  .product-main { padding: 16px; }
  .metric-row { grid-template-columns: 1fr 1fr; }
  .metric-card:nth-child(3) { display: none; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .assistant-card { display: none; }
  .signal-grid { grid-template-columns: 1fr 1fr; }
  .signal-grid > div { border-bottom: 1px solid rgba(255,255,255,.1); }
  .section-heading h2, .assistant-copy h2, .solutions-head h2, .security-copy h2, .faq-intro h2, .final-cta h2 { font-size: 42px; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 300px; padding: 26px; }
  .mini-visual, .mini-events { position: static; width: 100%; margin-top: 28px; }
  .chat-body { min-height: 360px; padding: 26px 18px 20px; }
  .message { max-width: 92%; }
  .prompt-suggestions { padding-left: 15px; padding-right: 15px; }
  .chat-input { margin-left: 15px; margin-right: 15px; }
  .workflow-tabs { grid-template-columns: 1fr 1fr; }
  .workflow-tab:nth-child(2) { border-right: 0; }
  .workflow-tab:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.1); }
  .workflow-copy-block, .workflow-visual { padding: 30px; }
  .workflow-copy-block h3 { font-size: 28px; }
  .solution-row { grid-template-columns: 34px 1fr 26px; gap: 12px; padding: 22px 0; }
  .solution-main h3 { font-size: 18px; }
  .security-cards { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px 24px; }
  .footer-brand, .footer-col:last-child { grid-column: 1 / -1; }
  .footer-bottom { flex-direction: column; }
  .demo-modal { padding: 30px 22px 24px; }
  .modal-copy h2 { font-size: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
  .reveal { opacity: 1; transform: none; }
}

/* =====================================================
   V4 PRODUCT-INSPIRED MARKETING DEMO
   Approximate Ciro UI — not a pixel-perfect product clone.
   ===================================================== */

.site-shell { overflow: clip; }
.hero-grid-product { grid-template-columns: .78fr 1.22fr; gap: 44px; }
.hero-command-bar {
  margin-top: 18px;
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border: 1px solid #d7dfe2;
  border-radius: 14px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 10px 28px rgba(12,28,42,.05);
  max-width: 620px;
}
.hero-command-label {
  flex: 0 0 auto;
  color: var(--orange);
  font-size: 10px;
  line-height: 1;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
}
.hero-command-bar strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
  color: #41535e;
}
.command-caret {
  width: 7px;
  height: 15px;
  margin-left: auto;
  background: var(--orange);
  border-radius: 2px;
  opacity: .75;
  animation: ciroBlink 1s steps(1,end) infinite;
}
@keyframes ciroBlink { 50% { opacity: .12; } }

.product-stage-real {
  padding: 0;
  overflow: hidden;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 34px 90px rgba(12,28,42,.17);
}
.product-stage-meta {
  height: 36px;
  padding: 0 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #f5f7f8;
  border-bottom: 1px solid #dfe5e7;
  color: #718089;
  font-size: 8px;
  font-weight: 700;
}
.product-stage-meta > span { display: inline-flex; align-items: center; gap: 7px; }
.product-stage-meta i { width: 6px; height: 6px; border-radius: 50%; background: #2ea36a; box-shadow: 0 0 0 4px rgba(46,163,106,.12); }
.product-stage-meta small { color: #9aa5aa; font-size: 8px; }

.ciro-app-demo {
  min-height: 565px;
  display: grid;
  grid-template-columns: 122px minmax(0,1fr) 212px;
  background: #eef2f5;
  color: #263741;
  font-size: 8px;
  overflow: hidden;
}

/* Left navigation */
.app-nav-mini {
  min-width: 0;
  padding: 12px 9px;
  background: #142747;
  color: #eef4ff;
  border-right: 1px solid rgba(255,255,255,.06);
}
.app-nav-top { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 12px; padding: 0 2px; }
.app-nav-top strong { font-size: 11px; letter-spacing: .02em; color: #fff; }
.app-nav-top button { width: 23px; height: 23px; border-radius: 6px; border: 1px solid rgba(255,255,255,.26); background: transparent; color: #fff; font-size: 10px; padding: 0; }
.mini-main-nav { display: grid; gap: 5px; }
.mini-main-nav button {
  width: 100%;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  padding: 8px 7px;
  background: rgba(255,255,255,.04);
  color: #f3f6fb;
  text-align: left;
  font-size: 8px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.mini-main-nav button:first-child { background: rgba(255,255,255,.12); }
.mini-main-nav button span { width: 12px; text-align: center; color: #fff; }
.mini-nav-label { margin: 14px 2px 6px; color: #9fb0ce; font-size: 6.5px; font-weight: 800; letter-spacing: .08em; }
.portfolio-segment { display: grid; grid-template-columns: 1fr 1fr; padding: 2px; border-radius: 7px; background: rgba(255,255,255,.07); margin-bottom: 6px; }
.portfolio-segment span { padding: 5px 3px; text-align: center; border-radius: 5px; color: #c2cde0; font-size: 7px; }
.portfolio-segment .active { background: rgba(255,255,255,.18); color: #fff; font-weight: 800; }
.mini-search { border: 1px solid rgba(255,255,255,.16); border-radius: 6px; padding: 6px 7px; color: #aebbd0; background: rgba(255,255,255,.05); font-size: 6.8px; margin-bottom: 7px; }
.app-portfolio-card {
  width: 100%;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  background: rgba(255,255,255,.04);
  color: #fff;
  padding: 9px 7px;
  text-align: left;
  margin: 0 0 6px;
  transition: .2s ease;
}
.app-portfolio-card strong { display: block; font-size: 8px; }
.app-portfolio-card small { display: block; margin-top: 3px; color: #aebbd0; font-size: 6.5px; }
.app-portfolio-card.active { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.24); box-shadow: inset 3px 0 0 var(--orange); }

/* Workspace */
.app-workspace { min-width: 0; background: #f7f9fb; border-right: 1px solid #dfe5e9; overflow: hidden; }
.app-workspace-head { height: 51px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 13px; background: #fff; border-bottom: 1px solid #e1e6e9; }
.app-workspace-head h3 { margin: 0; color: #102139; font-size: 13px; letter-spacing: -.02em; }
.app-workspace-head span { display: block; margin-top: 2px; color: #87949d; font-size: 6.5px; }
.app-workspace-head img { width: 48px; height: 22px; object-fit: cover; border-radius: 2px; }
.app-tabs { display: flex; gap: 0; overflow-x: auto; scrollbar-width: none; background: #fff; border-bottom: 1px solid #dce3e7; padding: 0 8px; }
.app-tabs::-webkit-scrollbar { display: none; }
.app-tab { flex: 0 0 auto; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #61717c; padding: 9px 8px 8px; font-size: 6.8px; white-space: nowrap; }
.app-tab:hover { color: #172a38; }
.app-tab.active { color: #102139; border-bottom-color: var(--orange); font-weight: 800; background: #fafbfc; }
.app-tab-wide { color: #7d8990; }
.app-view-stack { position: relative; padding: 10px; min-height: 500px; }
.app-view { display: none; }
.app-view.active { display: block; animation: appViewIn .26s ease both; }
@keyframes appViewIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.workspace-subhead, .page-title-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 9px; }
.workspace-subhead > div:first-child strong, .page-title-row strong { display: block; color: #1a2c38; font-size: 10px; }
.workspace-subhead small, .page-title-row small { display: block; margin-top: 2px; color: #83919a; font-size: 6.6px; }
.workspace-subhead em { color: #fff; background: #31a4e8; border-radius: 4px; padding: 1px 4px; font-style: normal; font-size: 6px; }
.workspace-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.app-workspace button { border: 1px solid #c7d0d5; background: #fff; color: #4b5d68; border-radius: 5px; padding: 5px 7px; font-size: 6.6px; line-height: 1.15; }
.app-workspace button:hover { border-color: #7c909c; color: #243640; }
.app-workspace button.green, .page-title-row button.green { border-color: #168956; color: #168956; }
.app-workspace button.blue, .page-title-row button.blue { border-color: #2c9ee8; background: #2c9ee8; color: #fff; }
.app-workspace button.amber { border-color: #e0a128; color: #ba7d0d; background: #fffaf0; }
.workspace-summary-row { display: grid; grid-template-columns: 1.45fr .7fr; gap: 7px; margin-bottom: 8px; }
.summary-box { min-height: 50px; border: 1px solid #dce3e7; border-radius: 9px; background: #fff; padding: 8px 9px; }
.summary-box strong { font-size: 7.5px; color: #263a47; }
.summary-box p { margin: 8px 0 0; color: #82909a; font-size: 6.5px; line-height: 1.4; }
.summary-suggest { background: #fbfcfd; }
.kpi-module { border: 1px solid #dbe3e7; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 5px 15px rgba(12,28,42,.03); transition: box-shadow .25s ease, transform .25s ease; }
.kpi-module.flash { box-shadow: 0 0 0 3px rgba(227,126,46,.13), 0 14px 30px rgba(12,28,42,.08); transform: translateY(-2px); }
.kpi-module-head { min-height: 31px; padding: 5px 7px; border-bottom: 1px solid #dfe5e9; background: #fbfcfd; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.kpi-module-head > div { display: flex; align-items: center; gap: 4px; min-width: 0; }
.kpi-module-head strong { color: #1e313d; font-size: 7.7px; }
.kpi-module-head b { padding: 2px 4px; background: #35a7e8; color: #fff; border-radius: 4px; font-size: 5.8px; }
.kpi-module-head mark { border-radius: 4px; background: #ffd646; color: #3f3718; padding: 3px 5px; font-size: 6px; font-weight: 800; }
.drag-dots { color: #95a3ab; font-size: 9px; }
.kpi-chart-card { margin: 8px; border: 1px solid #e1e6e9; border-radius: 8px; padding: 8px; background: #fff; }
.kpi-chart-title { color: #172b38; font-weight: 800; font-size: 7px; }
.kpi-legend { display: flex; align-items: center; justify-content: center; gap: 5px; color: #64737c; font-size: 6px; margin: 2px 0 2px; }
.kpi-legend i { width: 21px; height: 5px; background: #16945d; }
.vol-chart { width: 100%; height: 110px; overflow: visible; }
.vol-grid line { stroke: #e4e9ec; stroke-width: 1; }
#heroVolatilityPath { fill: none !important; stroke: #16945d !important; stroke-width: 2.4 !important; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.js-enhanced #heroVolatilityPath { stroke-dasharray: 900; stroke-dashoffset: 900; }
.js-enhanced .chart-live #heroVolatilityPath { animation: drawCiroLine 1.35s ease forwards; }
@keyframes drawCiroLine { to { stroke-dashoffset: 0; } }
.mini-x-axis { display: flex; justify-content: space-between; color: #8e999f; font-size: 5.8px; padding: 2px 7px 0; }
.returns-mini-card { margin: 0 8px 8px; border: 1px solid #e1e6e9; border-radius: 8px; padding: 8px; background: #fff; }
.histogram { height: 62px; display: flex; gap: 3px; align-items: end; padding: 6px 6px 0; border-bottom: 1px solid #e1e7ea; background: repeating-linear-gradient(to top, transparent 0, transparent 19px, #eef1f3 20px); }
.histogram span { flex: 1; min-width: 3px; height: var(--h); background: #e34355; border-radius: 1px 1px 0 0; transform-origin: bottom; animation: barRise .7s ease both; }
@keyframes barRise { from { transform: scaleY(0); } to { transform: scaleY(1); } }

/* Tasks / alerts / reports */
.task-filters { display: flex; gap: 0; margin-bottom: 8px; }
.task-filters button { border-radius: 0; margin-left: -1px; }
.task-filters button:first-child { margin-left: 0; border-radius: 5px 0 0 5px; }
.task-filters button:last-child { border-radius: 0 5px 5px 0; }
.task-filters .active { background: #43515b; color: #fff; border-color: #43515b; }
.task-card { border: 1px solid #dbe3e7; border-radius: 10px; background: #fff; padding: 9px; transition: .25s ease; }
.task-card.task-pulse { box-shadow: 0 0 0 3px rgba(227,126,46,.13), 0 12px 28px rgba(12,28,42,.08); transform: translateY(-1px); }
.task-card-head { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.task-card-head > div:first-child { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.task-card-head strong { font-size: 8px; color: #223642; }
.task-card-head span { padding: 2px 4px; border-radius: 4px; background: #f0f3f5; color: #697981; font-size: 5.8px; font-weight: 800; }
.task-card-head .monitoring, .monitoring { background: #168956 !important; color: #fff !important; }
.task-card-head small { flex-basis: 100%; color: #87949c; font-size: 6px; }
.task-details { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px 14px; margin-top: 12px; padding-top: 9px; border-top: 1px solid #edf0f2; }
.task-details span { display: block; color: #71808a; font-size: 5.7px; letter-spacing: .05em; }
.task-details strong { display: block; margin-top: 3px; color: #283b46; font-size: 6.6px; }
.alert-list-demo { display: grid; gap: 7px; }
.alert-list-demo article { display: grid; grid-template-columns: 9px minmax(0,1fr) auto auto; gap: 7px; align-items: center; border: 1px solid #dce3e7; border-radius: 8px; background: #fff; padding: 8px; }
.alert-list-demo strong { display: block; color: #263943; font-size: 7.5px; }
.alert-list-demo small { display: block; margin-top: 2px; color: #84919a; font-size: 6px; }
.alert-list-demo > article > span { color: #53646e; font-size: 7px; font-weight: 800; }
.alert-dot { width: 7px; height: 7px; border-radius: 50%; background: #9aa8af; }
.alert-dot.amber { background: #e0a128; box-shadow: 0 0 0 3px rgba(224,161,40,.12); }
.alert-dot.green { background: #1d9b63; }
.report-grid-demo { display: grid; gap: 7px; }
.report-grid-demo article { display: grid; grid-template-columns: 22px minmax(0,1fr) auto; gap: 8px; align-items: center; border: 1px solid #dce3e7; border-radius: 8px; background: #fff; padding: 9px; }
.report-icon { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; background: var(--orange-soft); color: var(--orange); font-size: 10px; }
.report-grid-demo strong { display: block; color: #243642; font-size: 7.5px; }
.report-grid-demo small { display: block; margin-top: 2px; color: #87949c; font-size: 6px; }
.report-grid-demo b { color: #168956; background: #edf7f1; padding: 3px 5px; border-radius: 999px; font-size: 5.8px; }
.empty-app-view { min-height: 300px; border: 1px dashed #d3dce1; border-radius: 10px; padding: 24px; background: #fff; color: #6e7f89; }
.empty-app-view strong { color: #243642; font-size: 11px; }
.empty-app-view p { max-width: 310px; line-height: 1.55; }

/* Assistant rail */
.app-ai-rail { min-width: 0; display: flex; flex-direction: column; background: #fff; }
.ai-rail-title { height: 51px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border-bottom: 1px solid #e1e6e9; }
.ai-rail-title strong { display: block; color: #15283a; font-size: 8px; }
.ai-rail-title small { display: block; margin-top: 2px; color: #82919a; font-size: 6px; }
.ai-rail-title button { border: 1px solid #bac6cd; background: #fff; border-radius: 4px; padding: 4px 6px; color: #64757e; font-size: 6px; }
.ai-rail-tabs { display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid #e1e6e9; }
.ai-rail-tabs button { border: 0; background: #fbfcfd; color: #64768a; font-size: 6.4px; padding: 9px 3px; border-bottom: 2px solid transparent; }
.ai-rail-tabs .active { color: #15283a; background: #fff; border-bottom-color: #15283a; font-weight: 800; }
.ai-budget { margin: 9px 9px 5px; padding: 8px; border: 1px solid #e1e6ea; border-radius: 8px; background: #fbfcfd; }
.ai-budget > div { display: flex; justify-content: space-between; color: #586b78; font-size: 6.2px; }
.ai-budget > span { display: block; height: 5px; margin: 5px 0; border-radius: 999px; background: #e6eaed; overflow: hidden; }
.ai-budget > span i { display: block; width: 0%; height: 100%; background: var(--orange); }
.ai-budget small { color: #87949d; font-size: 5.6px; }
.reply-style { padding: 5px 9px 8px; }
.reply-style > span { display: block; margin-bottom: 5px; color: #71808a; font-size: 6px; }
.reply-style > div { display: flex; gap: 3px; }
.reply-style button { flex: 1; border: 1px solid #d6dde1; border-radius: 999px; background: #f7f9fa; color: #596d79; font-size: 5.8px; padding: 5px 3px; }
.reply-style button.active { background: #36a7ea; border-color: #36a7ea; color: #fff; }
.ai-rail-chat { flex: 1; min-height: 0; padding: 7px 9px; overflow: auto; border-top: 1px solid #f0f2f4; }
.rail-message { margin-bottom: 7px; border-radius: 8px; padding: 7px 8px; font-size: 6.3px; line-height: 1.45; }
.rail-message > span { display: block; margin-bottom: 3px; color: #637585; font-size: 5.8px; font-weight: 800; }
.rail-message p { margin: 0; }
.rail-message.user, .rail-message.user p { background: #edf2f8; color: #273944; }
.rail-message.assistant { background: #fbfcfd; border: 1px solid #e1e7ea; color: #334751; }
.rail-message.assistant ul { margin: 5px 0; padding-left: 12px; }
.rail-message.assistant li { margin: 2px 0; }
.rail-message small { color: #788891; font-size: 5.6px; }
.hero-ai-response.is-thinking { opacity: .66; }
.ai-rail-input { padding: 8px 9px 10px; border-top: 1px solid #e1e6e9; }
.ai-rail-input input { width: 100%; border: 1px solid #cfd8dd; border-radius: 6px; padding: 7px 8px; outline: none; color: #2c3f4a; font-size: 6.5px; background: #fff; }
.ai-rail-input input:focus { border-color: var(--orange); box-shadow: 0 0 0 2px rgba(227,126,46,.1); }
.ai-rail-input button { margin-top: 5px; border: 0; border-radius: 5px; background: #2d9fe4; color: #fff; padding: 6px 10px; font-size: 6.5px; }
.app-toast { position: absolute; right: 14px; bottom: 14px; z-index: 4; max-width: 250px; display: flex; align-items: flex-start; gap: 8px; padding: 9px 11px; border: 1px solid #d9e3df; border-radius: 10px; background: rgba(255,255,255,.96); box-shadow: 0 15px 35px rgba(12,28,42,.16); opacity: 0; transform: translateY(12px); pointer-events: none; transition: .22s ease; }
.app-toast.show { opacity: 1; transform: translateY(0); }
.app-toast > span { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: #edf7f1; color: #168956; font-size: 8px; font-weight: 900; }
.app-toast strong { display: block; color: #20333f; font-size: 7px; }
.app-toast small { display: block; margin-top: 2px; color: #78868f; font-size: 6px; line-height: 1.4; }

/* Larger AI marketing section */
.assistant-layout-product { grid-template-columns: .82fr 1.18fr; gap: 58px; }
.assistant-product-card { min-width: 0; border: 1px solid #d9e0e3; border-radius: 22px; background: #fff; overflow: hidden; box-shadow: 0 24px 60px rgba(12,28,42,.11); }
.assistant-demo-browser { display: grid; grid-template-columns: 1.18fr .82fr; min-height: 400px; }
.assistant-demo-page { padding: 18px; background: #f5f8fa; }
.assistant-demo-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.assistant-demo-page-head strong { display: block; color: #20323e; font-size: 13px; }
.assistant-demo-page-head small { display: block; color: #798892; font-size: 8px; margin-top: 3px; }
.assistant-demo-page-head button { border: 0; border-radius: 7px; background: #35a7ea; color: #fff; padding: 7px 10px; font-size: 8px; }
.assistant-task-preview { border: 1px solid #dce3e7; border-radius: 12px; background: #fff; padding: 14px; box-shadow: 0 7px 20px rgba(12,28,42,.04); }
.assistant-task-preview > div:first-child { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.assistant-task-preview strong { font-size: 10px; color: #253844; }
.assistant-task-preview span, .assistant-task-preview b { padding: 3px 5px; border-radius: 5px; font-size: 7px; }
.assistant-task-preview span { background: #168956; color: #fff; }
.assistant-task-preview b { background: #eef2f4; color: #5d6f79; }
.assistant-task-preview small { flex-basis: 100%; color: #86949d; font-size: 7px; }
.assistant-task-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 18px; }
.assistant-task-meta span { background: #f5f7f8; color: #62737d; border: 1px solid #e2e7e9; }
.assistant-demo-rail { min-width: 0; display: flex; flex-direction: column; background: #fff; border-left: 1px solid #dde4e7; }
.assistant-demo-title { padding: 13px 14px; border-bottom: 1px solid #e2e7ea; }
.assistant-demo-title strong { display: block; font-size: 10px; color: #1e313f; }
.assistant-demo-title small { display: block; margin-top: 2px; color: #83919a; font-size: 7px; }
.assistant-demo-tabs { display: grid; grid-template-columns: repeat(3,1fr); border-bottom: 1px solid #e4e8eb; }
.assistant-demo-tabs span { text-align: center; padding: 9px 4px; color: #788995; font-size: 7px; border-bottom: 2px solid transparent; }
.assistant-demo-tabs .active { color: #1f323f; border-bottom-color: #1f323f; font-weight: 800; }
.assistant-demo-chat { flex: 1; padding: 12px; overflow: auto; background: #fff; }
.assistant-action-state { margin: 0 12px 10px; padding: 9px 10px; border-radius: 9px; background: #f3f6f7; border: 1px solid #e0e6e8; }
.assistant-action-state span { display: block; color: #84919a; font-size: 6.5px; text-transform: uppercase; letter-spacing: .08em; }
.assistant-action-state strong { display: block; margin-top: 3px; color: #4a5e69; font-size: 7.5px; }
.assistant-action-state.success { background: #eef8f2; border-color: #d5eadf; }
.assistant-action-state.success span { color: #168956; }
.assistant-demo-input { margin: 0 12px 13px; border: 1px solid #d4dde1; border-radius: 9px; display: flex; align-items: center; gap: 8px; padding: 6px 7px 6px 9px; color: #8a969d; font-size: 7px; }
.assistant-demo-input > span { flex: 1; min-width: 0; }
.assistant-demo-input button { border: 0; border-radius: 6px; background: #34a6e8; color: #fff; padding: 7px 10px; font-size: 7px; }
.product-prompt-suggestions { padding: 12px; border-top: 1px solid #e4e8ea; background: #fbfcfc; }
.product-prompt-suggestions button.active { border-color: var(--orange); background: var(--orange-soft); color: var(--orange); }

/* Product-inspired workflow cards */
.product-workflow-shell { background: rgba(255,255,255,.035); }
.product-workflow-visual { min-height: 430px; }
.workflow-product-card { width: min(100%, 520px); border-radius: 18px; overflow: hidden; box-shadow: 0 25px 65px rgba(0,0,0,.24); background: #f7f9fb; color: #263842; }
.workflow-sidebar-preview { width: min(100%, 300px); padding: 16px; background: #142747; color: white; }
.wf-sidebar-brand { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; font-weight: 800; font-size: 13px; }
.wf-sidebar-brand span { border: 1px solid rgba(255,255,255,.24); border-radius: 6px; padding: 3px 5px; font-size: 8px; }
.wf-nav-row { margin: 6px 0; border: 1px solid rgba(255,255,255,.09); border-radius: 8px; padding: 9px; background: rgba(255,255,255,.04); color: #dbe4f3; font-size: 9px; }
.wf-nav-row.active { background: rgba(255,255,255,.13); color: white; }
.workflow-sidebar-preview > small { display: block; margin: 15px 0 7px; color: #9db0ce; font-size: 7px; letter-spacing: .08em; }
.wf-portfolio { border: 1px solid rgba(255,255,255,.09); border-radius: 9px; padding: 10px; margin: 6px 0; background: rgba(255,255,255,.05); }
.wf-portfolio.active { background: rgba(255,255,255,.17); box-shadow: inset 3px 0 0 var(--orange); }
.wf-portfolio strong, .wf-portfolio span { display: block; }
.wf-portfolio strong { font-size: 9px; }
.wf-portfolio span { margin-top: 3px; color: #adbbd2; font-size: 7px; }
.wf-app-window { background: #f6f8fa; }
.wf-window-tabs { display: flex; gap: 2px; padding: 0 10px; overflow: hidden; background: #fff; border-bottom: 1px solid #dce3e7; }
.wf-window-tabs span { padding: 10px 6px 8px; color: #6a7b85; font-size: 7px; border-bottom: 2px solid transparent; white-space: nowrap; }
.wf-window-tabs span.active { color: #1e313e; border-bottom-color: var(--orange); font-weight: 800; }
.wf-window-body { padding: 17px; }
.wf-window-body > strong { color: #1d303d; font-size: 11px; }
.wf-kpi { margin-top: 13px; border: 1px solid #dce3e7; border-radius: 11px; background: #fff; overflow: hidden; }
.wf-kpi-head { display: flex; justify-content: space-between; align-items: center; padding: 9px 10px; border-bottom: 1px solid #e3e8ea; }
.wf-kpi-head span { font-size: 8px; font-weight: 800; }
.wf-kpi-head b { font-size: 6px; color: #fff; background: #34a6e9; border-radius: 4px; padding: 2px 5px; }
.wf-line-chart { padding: 12px; }
.wf-line-chart svg { width: 100%; height: 135px; }
.wf-line-chart path { fill: none; stroke: #17945f; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.wf-task-card { margin: 16px; padding: 14px; border: 1px solid #dbe3e7; border-radius: 12px; background: white; }
.wf-task-card > strong { color: #243642; font-size: 10px; }
.wf-task-card > small { display: block; margin-top: 5px; color: #87949c; font-size: 7px; }
.wf-task-card .monitoring { display: inline-block; margin-left: 5px; padding: 3px 5px; border-radius: 4px; font-size: 6px; }
.wf-task-details { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px; margin-top: 15px; padding-top: 12px; border-top: 1px solid #edf0f2; }
.wf-task-details > span { color: #75858e; font-size: 6px; }
.wf-task-details b { display: block; color: #2b3e49; margin-top: 4px; font-size: 7px; }
.wf-ai-card { display: grid; grid-template-columns: 1fr .8fr; }
.wf-ai-page { padding: 22px; background: #f5f8fa; }
.wf-ai-page strong { color: #233642; font-size: 11px; }
.wf-ai-page p { border: 1px solid #dfe5e8; border-radius: 9px; background: #fff; padding: 11px; color: #687a84; font-size: 8px; line-height: 1.55; }
.wf-ai-rail { padding: 14px; background: #fff; border-left: 1px solid #dce3e7; }
.wf-ai-rail h4 { margin: 0 0 14px; color: #223541; font-size: 9px; }
.wf-ai-message { margin-bottom: 9px; border-radius: 9px; padding: 10px; background: #edf2f8; color: #41535e; font-size: 7px; line-height: 1.5; }
.wf-ai-message.answer { background: #fbfcfd; border: 1px solid #e0e6e9; }
.wf-ai-action { margin-top: 12px; border-radius: 8px; padding: 9px; background: #eef8f2; color: #168956; font-size: 7px; font-weight: 800; }

/* Hero sizing refinements */
@media (max-width: 1180px) {
  .hero-grid-product { grid-template-columns: 1fr; }
  .product-stage-real { max-width: 940px; }
  .ciro-app-demo { grid-template-columns: 128px minmax(0,1fr) 235px; }
}

@media (max-width: 820px) {
  .ciro-app-demo { grid-template-columns: 92px minmax(0,1fr); }
  .app-ai-rail { grid-column: 1 / -1; min-height: 300px; border-top: 1px solid #dce3e7; }
  .app-nav-mini { grid-row: 1; }
  .app-workspace { grid-row: 1; border-right: 0; }
  .assistant-demo-browser { grid-template-columns: 1fr; }
  .assistant-demo-rail { border-left: 0; border-top: 1px solid #dde4e7; min-height: 320px; }
  .assistant-layout-product { grid-template-columns: 1fr; }
  .wf-ai-card { grid-template-columns: 1fr; }
  .wf-ai-rail { border-left: 0; border-top: 1px solid #dce3e7; }
}

@media (max-width: 560px) {
  .product-stage-meta small { display: none; }
  .ciro-app-demo { grid-template-columns: 1fr; }
  .app-nav-mini { display: none; }
  .app-workspace { grid-row: auto; }
  .workspace-actions { display: none; }
  .workspace-summary-row { grid-template-columns: 1fr; }
  .summary-suggest { display: none; }
  .app-tab-wide { display: none; }
  .task-details { grid-template-columns: 1fr; }
  .alert-list-demo article { grid-template-columns: 9px minmax(0,1fr) auto; }
  .alert-list-demo article button { grid-column: 2 / -1; justify-self: start; }
  .assistant-task-meta { grid-template-columns: 1fr; }
  .product-workflow-visual { padding: 24px; }
}

/* =====================================================
   CONTACT + APPLICATION ACCESS
   ===================================================== */

.contact-section {
  background: #f5f7f7;
  border-top: 1px solid #e0e5e7;
}

.contact-grid {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 72px;
  align-items: start;
}

.contact-copy h2 {
  margin: 20px 0 22px;
  color: var(--navy);
  font-size: clamp(42px, 4.8vw, 66px);
  line-height: 1.02;
  letter-spacing: -.05em;
  font-weight: 700;
}

.contact-copy h2 em {
  color: var(--orange);
  font-style: normal;
}

.contact-copy > p {
  max-width: 610px;
  margin: 0;
  color: #687780;
  font-size: 15px;
  line-height: 1.8;
}

.contact-points {
  margin-top: 34px;
  border-top: 1px solid #d7dddf;
}

.contact-points > div {
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 12px;
  padding: 18px 0;
  border-bottom: 1px solid #d7dddf;
}

.contact-points > div > span {
  color: var(--orange);
  font-size: 10px;
  font-weight: 800;
  padding-top: 3px;
}

.contact-points p {
  margin: 0;
  color: #687780;
  font-size: 12px;
  line-height: 1.65;
}

.contact-points strong {
  color: var(--navy);
}

.contact-card {
  border: 1px solid #dce2e4;
  border-radius: 24px;
  background: #fff;
  padding: 34px;
  box-shadow: 0 24px 60px rgba(12,28,42,.08);
}

.contact-card form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.contact-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}

.contact-card label {
  color: #53636c;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.contact-card input,
.contact-card select,
.contact-card textarea {
  width: 100%;
  display: block;
  margin-top: 7px;
  border: 1px solid #d5dddf;
  border-radius: 11px;
  background: #fff;
  padding: 12px 13px;
  outline: none;
  color: var(--navy);
  font: inherit;
  font-size: 13px;
  text-transform: none;
  letter-spacing: normal;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.contact-card textarea {
  resize: vertical;
  min-height: 132px;
  line-height: 1.55;
}

.contact-card input:focus,
.contact-card select:focus,
.contact-card textarea:focus {
  border-color: var(--orange);
  box-shadow: 0 0 0 3px rgba(227,126,46,.1);
}

.form-honeypot {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.contact-privacy {
  margin: 0;
  color: #87959b;
  font-size: 10px;
  line-height: 1.6;
}

.final-cta-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

@media (max-width: 900px) {
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 42px;
  }
}

@media (max-width: 640px) {
  .contact-card {
    padding: 24px 20px;
  }

  .contact-form-grid {
    grid-template-columns: 1fr;
  }

  .final-cta-buttons .btn {
    width: 100%;
  }
}



/* Alerts feature card — keep the status items in normal flow so they never overlap copy */
.feature-card-alerts {
  padding-bottom: 30px;
}

.feature-card-alerts > p {
  max-width: 100%;
}

.feature-card-alerts .mini-events {
  position: static;
  width: 100%;
  margin-top: 30px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.feature-card-alerts .mini-events span {
  min-height: 74px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 9px;
  padding: 13px 14px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  color: #c3cdd3;
  font-size: 9px;
  line-height: 1.45;
}

.feature-card-alerts .mini-events span:hover {
  border-color: rgba(227,126,46,.38);
  background: rgba(227,126,46,.06);
}

.feature-card-alerts .mini-events i {
  width: 7px;
  height: 7px;
  margin: 0;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 0 5px rgba(227,126,46,.09);
}

@media (max-width: 980px) {
  .feature-card-alerts .mini-events {
    grid-template-columns: 1fr;
  }

  .feature-card-alerts .mini-events span {
    min-height: 0;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
  }
}


/* =====================================================
   CURRENT PRODUCT VISUAL REFRESH — OCT 2026
   Product-inspired, intentionally simplified for marketing.
   ===================================================== */

.mobile-app-link { display: none; }

.ciro-app-demo-current {
  min-height: 596px;
  grid-template-columns: 108px minmax(0,1fr) 194px;
}

.ciro-app-demo-current .app-nav-mini { padding: 10px 8px; }
.ciro-app-demo-current .app-workspace-head { height: 47px; }
.ciro-app-demo-current .app-ai-rail .ai-rail-title { height: 47px; }
.ciro-app-demo-current .app-view-stack { min-height: 522px; padding: 8px; }
.ciro-app-demo-current .app-tab { padding: 8px 6px 7px; font-size: 6.2px; }
.app-tab-badged b { margin-left: 3px; min-width: 12px; padding: 1px 3px; border-radius: 4px; background: #df3448; color: #fff; font-size: 5.5px; }
.app-tab-badged .muted-badge { background: #6f7980; }

.workspace-summary-current { grid-template-columns: 1.45fr .6fr; }
.tiny-status { display: inline-block; margin-right: 4px; padding: 1px 4px; border-radius: 999px; background: #6f7980; color: #fff; font-size: 5.5px; font-weight: 800; }

.workspace-module-grid {
  display: grid;
  grid-template-columns: minmax(0,1.08fr) minmax(0,.92fr);
  gap: 7px;
  align-items: stretch;
}

.workspace-module-grid .kpi-module { min-width: 0; }
.current-module-head { min-height: 28px; padding: 4px 6px; }
.current-module-head > div { gap: 3px; }
.current-module-head strong { font-size: 7px; white-space: nowrap; }
.current-module-head button { padding: 4px 5px; font-size: 5.7px; }
.current-module-head mark { font-size: 5.3px; padding: 2px 4px; }
.current-module-head .module-help { width: 13px; height: 13px; padding: 0; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 1px solid #adb8be; color: #687982; font-size: 6px; }
.current-module-head .module-report { background: #168956; }
.current-module-head .module-live { background: #df3448; }
.valuation-pill { display: inline-block; margin: 6px 6px 0; padding: 2px 5px; border: 1px solid #d9e0e3; border-radius: 5px; background: #fff; color: #5f7079; font-size: 5.2px; font-weight: 700; }

.analytical-chart-card, .exposure-card { margin: 6px; border: 1px solid #e0e5e8; border-radius: 8px; background: #fff; padding: 7px; }
.var-distribution-chart { width: 100%; height: 112px; overflow: visible; }
.var-grid line { stroke: #e4e8eb; stroke-width: 1; }
.var-curve { fill: none; stroke: #1e71f2; stroke-width: 2.2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.var-tail { fill: none; stroke: #1c8d58; stroke-width: 2.2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.var-line { stroke: #ef3446; stroke-width: 1.3; stroke-dasharray: 4 3; }
.cvar-line { stroke: #7654d6; stroke-width: 1.3; stroke-dasharray: 4 3; }
.var-label { fill: #ef3446; font-size: 7px; font-weight: 700; }
.cvar-label { fill: #7654d6; font-size: 7px; font-weight: 700; }
.axis-line { stroke: #cdd5d9; stroke-width: 1; }
.var-axis { display: flex; justify-content: space-between; color: #89969e; font-size: 5.2px; margin-top: -6px; padding: 0 5px; }
.js-enhanced #heroVarCurve { stroke-dasharray: 720; stroke-dashoffset: 720; }
.js-enhanced .chart-live #heroVarCurve { animation: drawCurrentVar 1.15s ease forwards; }
@keyframes drawCurrentVar { to { stroke-dashoffset: 0; } }

.component-var-mini { margin: 0 6px 6px; padding: 7px; border: 1px solid #e0e5e8; border-radius: 8px; background: #fff; display: grid; grid-template-columns: 1fr 62px; gap: 6px; align-items: center; }
.component-var-mini > div:first-child strong { display: block; color: #263943; font-size: 6.6px; }
.component-var-mini > div:first-child small { display: block; margin-top: 2px; color: #85929a; font-size: 5.3px; }
.component-pie { width: 58px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(#198b54 0 20.5%, #e43142 20.5% 48.9%, #6d43c7 48.9% 60.4%, #ff7a12 60.4% 70%, #16b9d5 70% 79%, #d52c78 79% 87.6%, #7b858c 87.6% 94%, #20be94 94% 100%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.5); }
.component-legend { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,1fr); gap: 3px; }
.component-legend span { color: #687983; font-size: 4.8px; white-space: nowrap; }
.component-legend i { width: 5px; height: 5px; border-radius: 50%; display: inline-block; margin-right: 3px; }
.component-legend .cat { background:#198b54; }.component-legend .googl { background:#6d43c7; }.component-legend .other { background:#e43142; }

.exposure-pie-wrap { display: grid; grid-template-columns: 74px 1fr; gap: 7px; align-items: center; margin-top: 5px; }
.exposure-pie { width: 72px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(#1f70f5 0 73.6%, #178b55 73.6% 83.2%, #e43446 83.2% 100%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.65); }
.exposure-legend { display: grid; gap: 5px; }
.exposure-legend span { color: #667780; font-size: 5.3px; }
.exposure-legend b { float: right; color: #2a3d48; }
.exposure-legend i { width: 6px; height: 6px; display: inline-block; border-radius: 50%; margin-right: 4px; }
.exposure-legend .long { background:#1f70f5; }.exposure-legend .short { background:#178b55; }.exposure-legend .cash { background:#e43446; }
.exposure-table-mini { margin: 0 6px 6px; border: 1px solid #e0e5e8; border-radius: 7px; overflow: hidden; background: #fff; }
.exposure-table-head, .exposure-table-mini > div { display: grid; grid-template-columns: .7fr 1fr .65fr; gap: 4px; align-items: center; padding: 4px 6px; }
.exposure-table-head { background: #f2f4f5; color: #61727b; font-size: 5px; font-weight: 800; }
.exposure-table-mini > div:not(.exposure-table-head) { border-top: 1px solid #edf0f2; color: #667780; font-size: 5.3px; }
.exposure-table-mini strong { color: #263943; }.exposure-table-mini b { color: #263943; }

.task-toolbar-current { display: flex; justify-content: space-between; gap: 7px; align-items: center; margin-bottom: 8px; }
.task-search-mini { flex: 0 1 190px; border: 1px solid #d7dfe3; border-radius: 5px; padding: 5px 7px; color: #8b979e; background: #fff; font-size: 5.8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.task-details-current { grid-template-columns: repeat(3,1fr); }
.task-template-mini { margin-top: 10px; padding: 8px; border: 1px solid #e0e5e8; border-radius: 7px; background: #fbfcfd; display: flex; justify-content: space-between; gap: 12px; }
.task-template-mini strong, .task-template-mini span, .task-template-mini small, .task-template-mini b { display: block; }
.task-template-mini strong { color: #31444f; font-size: 6.4px; }.task-template-mini span { color: #168956; font-size: 5.6px; font-weight: 800; margin-top: 2px; }.task-template-mini small { color: #829099; font-size: 5.2px; margin-top: 3px; }.task-template-mini b { color: #52636d; font-size: 5.4px; text-align: right; }

.alert-status-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 5px; margin-bottom: 8px; }
.alert-status-grid > div { min-height: 43px; border: 1px solid #dce3e7; border-radius: 6px; background: #fff; padding: 6px; }
.alert-status-grid span { display: block; color: #677780; font-size: 5.4px; }
.alert-status-grid b { display: inline-block; margin-top: 5px; min-width: 16px; padding: 2px 4px; border-radius: 4px; color: #fff; font-size: 5.5px; text-align: center; }
.alert-status-grid .critical { background:#df3448; }.alert-status-grid .warning { background:#f4bd18; color:#382d00; }.alert-status-grid .ack { background:#35a7e8; }.alert-status-grid .muted { background:#67727a; }.alert-status-grid .resolved { background:#168956; }
.alert-filter-row { display: grid; grid-template-columns: repeat(4,1fr); gap: 5px; margin-bottom: 7px; }
.alert-filter-row span { border: 1px solid #d5dde1; border-radius: 5px; background:#fff; color:#657680; padding:5px 6px; font-size:5.2px; }
.alert-lifecycle-mini { display:flex; justify-content:space-between; gap:8px; padding:7px 8px; margin-bottom:7px; border:1px solid #dbe2e6; border-radius:6px; background:#fff; color:#51636e; font-size:5.5px; }
.alert-table-current { border:1px solid #dce3e7; border-radius:7px; overflow:hidden; background:#fff; }
.alert-table-current > div { display:grid; grid-template-columns:.65fr .75fr .75fr 1.4fr .6fr; gap:4px; align-items:center; padding:5px 6px; border-top:1px solid #edf0f2; font-size:5.3px; }
.alert-table-current .alert-table-head { border-top:0; background:#f2f4f5; color:#687982; font-weight:800; }
.alert-table-current b { padding:2px 3px; border-radius:3px; font-size:4.9px; }
.alert-table-current .breach { background:#df3448; color:#fff; }.alert-table-current .warning-pill { background:#f2bd18; color:#3b3000; }.alert-table-current .active-pill { background:#df3448; color:#fff; }.alert-table-current .resolved-pill { background:#168956; color:#fff; }

.app-ai-rail-current .ai-budget-current > span i { width:47%; background:#36a7ea; }
.app-ai-rail-current .ai-rail-chat { padding-top: 6px; }
.rail-message.compact { padding-top: 6px; padding-bottom: 6px; }
.ai-next-checks { margin: 5px 0 8px; padding: 6px 7px; border-top: 1px solid #eef1f3; }
.ai-next-checks > span { display:block; margin-bottom:5px; color:#74848e; font-size:5.5px; }
.ai-next-checks > div { display:flex; gap:4px; }.ai-next-checks button { border:1px solid #b9c5cc; background:#fff; border-radius:4px; padding:3px 5px; color:#5b6d77; font-size:5.3px; }

/* Feature-card snapshots */
.feature-card-product-visual { padding-bottom: 26px; }
.feature-card-product-visual > p { max-width: 100%; }
.mini-live-monitor, .mini-scheduled-report { margin-top: 25px; border:1px solid rgba(255,255,255,.10); border-radius:15px; background:rgba(0,0,0,.10); padding:12px; }
.mini-monitor-head { display:flex; justify-content:space-between; align-items:center; color:#b9c7cf; font-size:8px; margin-bottom:8px; }.mini-monitor-head b { color:#79d39f; }
.mini-treemap { height:75px; display:grid; grid-template-columns:1.25fr .85fr .8fr; grid-template-rows:1fr 1fr; gap:2px; }
.mini-treemap i { display:grid; place-items:center; background:#4a5667; color:#fff; font-style:normal; font-size:7px; font-weight:800; }.mini-treemap .tm-a{grid-row:1/3}.mini-treemap .tm-b{grid-row:1/3}.mini-treemap .tm-d{background:#25bd59}
.mini-var-line { margin-top:8px; display:flex; align-items:center; gap:8px; }.mini-var-line svg { flex:1; height:30px; }.mini-var-line path{fill:none;stroke:#55a4ff;stroke-width:2}.mini-var-line span{color:#93a6b0;font-size:7px;white-space:nowrap}
.mini-scheduled-report > div:first-child { display:flex; align-items:center; justify-content:space-between; gap:8px; }.mini-scheduled-report strong{color:#d9e2e7;font-size:9px}.mini-scheduled-report b{color:#79d39f;font-size:7px}.mini-scheduled-report > span{display:block;margin-top:8px;color:#92a4ae;font-size:7px}.mini-report-meta{display:flex;gap:6px;margin-top:9px}.mini-report-meta i{font-style:normal;padding:5px 7px;border-radius:7px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);color:#9db0ba;font-size:6.5px}
.feature-card-alerts .mini-events span b { color:#dbe3e7; font-size:8px; }

/* Current AI marketing visual */
.assistant-product-card-current { border-radius: 24px; }
.assistant-demo-current { grid-template-columns: 1.08fr .92fr; min-height: 470px; }
.assistant-context-page { padding: 16px; }
.assistant-live-pill { align-self:flex-start; padding:4px 7px; border-radius:999px; background:#168956; color:#fff; font-size:7px; font-weight:800; }
.assistant-var-preview { margin-top: 12px; border:1px solid #dce3e7; border-radius:12px; background:#fff; padding:12px; }
.assistant-var-header { display:flex; justify-content:space-between; gap:10px; color:#60717b; font-size:7px; }.assistant-var-header b{color:#ef3446}
.assistant-var-preview svg { width:100%; height:155px; margin-top:3px; }.assistant-var-preview svg g line{stroke:#e4e9ec;stroke-width:1}.assistant-var-preview svg path{fill:none;stroke:#1f70f5;stroke-width:2.4}.assistant-var-preview .a-var{stroke:#ef3446;stroke-dasharray:4 3}.assistant-var-preview .a-cvar{stroke:#7654d6;stroke-dasharray:4 3}
.assistant-exposure-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; margin-top:3px; }.assistant-exposure-strip span{padding:6px;border-radius:7px;background:#f4f6f7;color:#667780;font-size:6px}.assistant-exposure-strip i{width:6px;height:6px;border-radius:50%;display:inline-block;background:#1f70f5;margin-right:4px}.assistant-exposure-strip span:nth-child(2) i{background:#178b55}.assistant-exposure-strip span:nth-child(3) i{background:#e43446}
.assistant-position-card { margin-top:10px; padding:12px; border:1px solid #dce3e7; border-radius:12px; background:#fff; }.assistant-position-card span,.assistant-position-card strong,.assistant-position-card b,.assistant-position-card small{display:block}.assistant-position-card span{color:#84919a;font-size:7px}.assistant-position-card strong{margin-top:5px;color:#20333f;font-size:17px}.assistant-position-card b{margin-top:3px;color:#1c8d58;font-size:9px}.assistant-position-card small{margin-top:4px;color:#7e8d95;font-size:6.5px}
.assistant-demo-budget { padding:9px 12px 0; }.assistant-demo-budget > div{display:flex;justify-content:space-between;color:#60717c;font-size:7px}.assistant-demo-budget > i{display:block;height:6px;margin-top:5px;border-radius:999px;background:#e5e9ec;overflow:hidden}.assistant-demo-budget em{display:block;width:47%;height:100%;background:#35a7e8}
.assistant-demo-rail-current .assistant-demo-chat { padding-top:10px; }

/* Workflow refresh */
.wf-monitor-card { background:#f6f8fa; padding-bottom:12px; }.wf-monitor-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:8px;padding:12px}.wf-treemap{height:150px;display:grid;grid-template-columns:1.3fr .9fr;grid-template-rows:1fr 1fr;gap:3px}.wf-treemap i{display:grid;place-items:center;background:#4b5666;color:#fff;font-style:normal;font-size:10px;font-weight:800}.wf-treemap i:first-child{grid-row:1/3}.wf-treemap .gain{background:#23bf58}.wf-var-mini{border:1px solid #dce3e7;border-radius:9px;background:#fff;padding:10px}.wf-var-mini strong,.wf-var-mini span{display:block}.wf-var-mini strong{font-size:7px;color:#263944}.wf-var-mini svg{width:100%;height:90px}.wf-var-mini path{fill:none;stroke:#1f70f5;stroke-width:2.2}.wf-var-mini span{color:#ef3446;font-size:6.5px}.wf-exposure-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:0 12px}.wf-exposure-mini span{padding:8px;border:1px solid #dce3e7;border-radius:7px;background:#fff;color:#667780;font-size:7px}.wf-exposure-mini b{float:right;color:#243844}
.wf-ops-card{padding:14px;background:#f6f8fa}.wf-ops-status{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.wf-ops-status span{padding:9px;border:1px solid #dce3e7;border-radius:8px;background:#fff}.wf-ops-status small,.wf-ops-status b{display:block}.wf-ops-status small{color:#7b8a93;font-size:6px}.wf-ops-status b{margin-top:3px;color:#243844;font-size:10px}.wf-ops-card .wf-task-card{margin:10px 0}.wf-alert-row{display:grid;grid-template-columns:auto 1fr auto auto;gap:7px;align-items:center;padding:9px;border:1px solid #dce3e7;border-radius:8px;background:#fff;color:#5e707a;font-size:7px}.wf-alert-row > b{padding:3px 5px;border-radius:4px;background:#df3448;color:#fff}.wf-alert-row strong{color:#243844}.wf-alert-row i{font-style:normal;color:#fff;background:#df3448;border-radius:4px;padding:3px 5px}
.wf-ai-card-current .wf-ai-page b{float:right;color:#1d8f5a}.wf-ai-card-current .wf-ai-action{background:#eef5ff;color:#2b72c7}

@media (max-width: 1180px) {
  .ciro-app-demo-current { grid-template-columns: 118px minmax(0,1fr) 220px; }
}

@media (max-width: 900px) {
  .mobile-app-link { display:block; color:var(--orange) !important; }
  .workspace-module-grid { grid-template-columns:1fr; }
  .ciro-app-demo-current { grid-template-columns: 96px minmax(0,1fr); }
  .ciro-app-demo-current .app-ai-rail { grid-column:1 / -1; min-height:310px; }
  .assistant-demo-current { grid-template-columns:1fr; }
  .assistant-demo-rail-current { border-left:0; border-top:1px solid #dde4e7; min-height:350px; }
}

@media (max-width: 560px) {
  .workspace-module-grid { display:block; }
  .exposure-module { margin-top:7px; }
  .app-tab-badged { display:none; }
  .alert-status-grid { grid-template-columns:repeat(2,1fr); }
  .alert-filter-row { grid-template-columns:1fr 1fr; }
  .alert-table-current > div { grid-template-columns:.8fr .9fr 1fr; }
  .alert-table-current > div > *:nth-child(4), .alert-table-current > div > *:nth-child(5) { display:none; }
  .task-details-current { grid-template-columns:1fr 1fr; }
  .task-template-mini { flex-direction:column; }
  .task-template-mini b { text-align:left; }
  .wf-monitor-grid { grid-template-columns:1fr; }
}


/* =====================================================
   PRODUCT REFRESH V2 — simplified hero + symbolic measure card
   ===================================================== */

/* Hero preview: show the product workspace without an embedded AI chat rail. */
.ciro-app-demo-current {
  grid-template-columns: 122px minmax(0, 1fr) !important;
}

.ciro-app-demo-current .app-workspace {
  border-right: 0;
}

/* Symbolic treatment for Risk & Performance instead of another dashboard screenshot. */
.feature-card-symbolic {
  min-height: 365px;
}

.risk-symbolic-visual {
  position: absolute;
  right: 26px;
  bottom: 24px;
  width: 230px;
  height: 164px;
}

.risk-symbolic-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(227,126,46,.22);
  border-radius: 50%;
  transform: translate(-50%,-50%);
}

.risk-symbolic-orbit.orbit-one {
  width: 116px;
  height: 116px;
}

.risk-symbolic-orbit.orbit-two {
  width: 164px;
  height: 164px;
  border-color: rgba(255,255,255,.12);
}

.risk-symbolic-core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 70px;
  height: 70px;
  transform: translate(-50%,-50%);
  display: grid;
  place-items: center;
  align-content: center;
  border-radius: 50%;
  background: rgba(227,126,46,.11);
  border: 1px solid rgba(227,126,46,.34);
  box-shadow: 0 0 0 12px rgba(227,126,46,.025);
}

.risk-symbolic-core span {
  color: var(--orange-2);
  font-size: 22px;
  font-weight: 800;
}

.risk-symbolic-core small {
  margin-top: 2px;
  color: #91a3ad;
  font-size: 7px;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.risk-symbol {
  position: absolute;
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
  color: #b6c4cc;
  font-size: 8px;
  font-weight: 700;
  box-shadow: 0 8px 22px rgba(0,0,0,.08);
}

.risk-symbol::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--orange);
  vertical-align: 1px;
}

.risk-symbol-one { left: 0; top: 19px; }
.risk-symbol-two { right: 0; top: 16px; }
.risk-symbol-three { left: -6px; bottom: 18px; }
.risk-symbol-four { right: 4px; bottom: 13px; }

/* More informative Value at Risk context in the Ciro AI section. */
.var-detail-summary {
  display: grid;
  grid-template-columns: 1.2fr .9fr .8fr;
  gap: 8px;
  margin-bottom: 10px;
}

.var-detail-primary,
.var-detail-stat {
  border: 1px solid #dfe5e8;
  border-radius: 11px;
  background: #fff;
  padding: 11px 12px;
}

.var-detail-primary {
  background: linear-gradient(145deg, #fff 0%, #fff7f0 100%);
  border-color: rgba(227,126,46,.24);
}

.var-detail-primary span,
.var-detail-stat span {
  display: block;
  color: #73828b;
  font-size: 7px;
  font-weight: 700;
}

.var-detail-primary strong {
  display: block;
  margin: 4px 0 2px;
  color: var(--orange);
  font-size: 24px;
  letter-spacing: -.04em;
}

.var-detail-primary small {
  color: #85929a;
  font-size: 6.5px;
}

.var-detail-stat strong {
  display: block;
  margin-top: 7px;
  color: #243743;
  font-size: 12px;
  letter-spacing: -.02em;
}

.assistant-var-preview-detailed {
  margin-bottom: 10px;
}

.assistant-var-preview-detailed svg .assistant-loss-tail {
  fill: rgba(227,126,46,.12);
  stroke: none;
}

.var-detail-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 10px;
  margin-top: 5px;
  color: #6f7f88;
  font-size: 6.3px;
}

.var-detail-legend span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.var-detail-legend i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
}

.loss-tail-dot { background: var(--orange); }
.var-dot { background: #e53f4f; }
.cvar-dot { background: #7150d9; }

.var-contributors {
  border: 1px solid #dfe5e8;
  border-radius: 11px;
  background: #fff;
  padding: 10px 11px;
  margin-bottom: 10px;
}

.var-contributors-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.var-contributors-head strong {
  color: #263944;
  font-size: 8px;
}

.var-contributors-head span {
  color: #8a969d;
  font-size: 6px;
}

.var-contributor-row {
  display: grid;
  grid-template-columns: 42px 1fr 34px;
  gap: 7px;
  align-items: center;
  margin: 6px 0;
}

.var-contributor-row > span,
.var-contributor-row > b {
  color: #5d6f79;
  font-size: 6.5px;
}

.var-contributor-row > b {
  text-align: right;
  color: #293b46;
}

.var-contributor-row > i {
  height: 5px;
  border-radius: 999px;
  background: #edf1f3;
  overflow: hidden;
}

.var-contributor-row > i > em {
  display: block;
  width: var(--w);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(227,126,46,.38), var(--orange));
}

@media (max-width: 1180px) {
  .ciro-app-demo-current {
    grid-template-columns: 128px minmax(0, 1fr) !important;
  }
}

@media (max-width: 820px) {
  .ciro-app-demo-current {
    grid-template-columns: 92px minmax(0,1fr) !important;
  }

  .risk-symbolic-visual {
    position: relative;
    right: auto;
    bottom: auto;
    width: min(100%, 240px);
    margin: 28px auto 0;
  }
}

@media (max-width: 640px) {
  .var-detail-summary {
    grid-template-columns: 1fr;
  }

  .risk-symbolic-visual {
    height: 150px;
  }
}

/* =====================================================
   PRODUCT REFRESH V3 — symbolic risk card spacing fix
   Keep the visual in normal document flow so it can never
   overlap the card heading or paragraph.
   ===================================================== */

.feature-card-symbolic {
  display: flex;
  flex-direction: column;
  min-height: 430px;
}

.feature-card-symbolic > p {
  max-width: 100%;
}

.feature-card-symbolic .risk-symbolic-visual {
  position: relative;
  right: auto;
  bottom: auto;
  width: min(100%, 340px);
  height: 166px;
  margin: 30px auto 0;
  flex: 0 0 166px;
}

.feature-card-symbolic .risk-symbolic-orbit.orbit-one {
  width: 104px;
  height: 104px;
}

.feature-card-symbolic .risk-symbolic-orbit.orbit-two {
  width: 148px;
  height: 148px;
}

.feature-card-symbolic .risk-symbolic-core {
  width: 64px;
  height: 64px;
}

.feature-card-symbolic .risk-symbol {
  max-width: 112px;
  white-space: nowrap;
  padding: 6px 10px;
  font-size: 8px;
}

.feature-card-symbolic .risk-symbol-one {
  left: 2px;
  top: 16px;
}

.feature-card-symbolic .risk-symbol-two {
  right: 2px;
  top: 16px;
}

.feature-card-symbolic .risk-symbol-three {
  left: 2px;
  bottom: 16px;
}

.feature-card-symbolic .risk-symbol-four {
  right: 2px;
  bottom: 16px;
}

@media (max-width: 980px) {
  .feature-card-symbolic {
    min-height: 0;
  }

  .feature-card-symbolic .risk-symbolic-visual {
    width: min(100%, 320px);
    margin-top: 26px;
  }
}

@media (max-width: 420px) {
  .feature-card-symbolic .risk-symbolic-visual {
    height: 190px;
    flex-basis: 190px;
  }

  .feature-card-symbolic .risk-symbol-one,
  .feature-card-symbolic .risk-symbol-two,
  .feature-card-symbolic .risk-symbol-three,
  .feature-card-symbolic .risk-symbol-four {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }

  .feature-card-symbolic .risk-symbol-one { top: 0; }
  .feature-card-symbolic .risk-symbol-two { top: 34px; }
  .feature-card-symbolic .risk-symbol-three { top: auto; bottom: 34px; }
  .feature-card-symbolic .risk-symbol-four { top: auto; bottom: 0; }

  .feature-card-symbolic .risk-symbolic-orbit.orbit-two {
    width: 118px;
    height: 118px;
  }

  .feature-card-symbolic .risk-symbolic-orbit.orbit-one {
    width: 84px;
    height: 84px;
  }

  .feature-card-symbolic .risk-symbolic-core {
    width: 54px;
    height: 54px;
  }
}


/* =====================================================
   MOBILE / TABLET PORTRAIT SIMPLIFICATION
   Use concise product summaries instead of compressed app UI.
   ===================================================== */

.mobile-product-summary {
  display: none;
}

@media (max-width: 1024px) and (orientation: portrait),
       (max-width: 640px) {

  /* Desktop-style product previews become too dense in portrait. */
  .product-stage-real,
  .assistant-product-card,
  .product-workflow-visual {
    display: none !important;
  }

  .mobile-product-summary {
    display: grid;
    gap: 12px;
    margin-top: 20px;
  }

  .mobile-product-summary article {
    position: relative;
    overflow: hidden;
    padding: 16px 17px;
    border: 1px solid rgba(12, 28, 42, .09);
    border-radius: 16px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 10px 28px rgba(12, 28, 42, .055);
  }

  .mobile-product-summary article::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--orange);
  }

  .mobile-product-summary strong {
    display: block;
    margin-bottom: 6px;
    color: var(--navy);
    font-size: 15px;
    line-height: 1.25;
    font-weight: 800;
  }

  .mobile-product-summary span {
    display: block;
    color: #667983;
    font-size: 12.5px;
    line-height: 1.6;
  }

  .hero-grid-product {
    grid-template-columns: 1fr !important;
    gap: 26px;
  }

  .hero-copy {
    max-width: 100%;
  }

  .hero-proof {
    margin-top: 20px;
  }

  /* Keep the narrative sections but remove the empty visual column. */
  .assistant-layout-product {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }

  .workflow-content {
    grid-template-columns: 1fr !important;
  }

  .workflow-copy-block {
    padding: 34px !important;
  }

  .feature-grid,
  .contact-grid {
    grid-template-columns: 1fr !important;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .section-pad {
    padding-top: 78px;
    padding-bottom: 78px;
  }
}

@media (max-width: 640px) {
  .hero {
    padding-top: 34px;
  }

  .hero h1 {
    font-size: clamp(42px, 13vw, 58px);
  }

  .hero-lede {
    font-size: 15px;
    line-height: 1.65;
  }

  .hero-command-bar {
    min-height: 0;
    padding: 10px 12px;
  }

  .hero-command-bar strong {
    font-size: 10px;
  }

  .hero-proof {
    padding-top: 20px;
  }

  .mobile-product-summary article {
    padding: 15px 16px;
  }

  .section-pad {
    padding-top: 68px;
    padding-bottom: 68px;
  }

  .assistant-copy h2,
  .section-heading h2,
  .solutions-head h2,
  .security-copy h2,
  .faq-intro h2,
  .final-cta h2,
  .contact-copy h2 {
    font-size: 39px;
  }

  .workflow-tabs {
    grid-template-columns: 1fr 1fr;
  }

  .workflow-copy-block {
    padding: 28px 24px !important;
  }

  .footer-grid {
    grid-template-columns: 1fr !important;
  }

  .footer-brand,
  .footer-col:last-child {
    grid-column: auto !important;
  }
}

/* =====================================================
   PRODUCT REFRESH V5 — real product screenshots
   ===================================================== */
.app-image-view {
  min-height: 300px;
  border: 1px solid #dce3e7;
  border-radius: 10px;
  padding: 12px;
  background: #fff;
}

.screenshot-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.screenshot-panel-head strong {
  display: block;
  color: #243642;
  font-size: 10px;
}

.screenshot-panel-head small {
  display: block;
  margin-top: 3px;
  color: #7b8b95;
  font-size: 6.3px;
  line-height: 1.45;
}

.app-screenshot-card {
  border: 1px solid #e2e8eb;
  border-radius: 10px;
  background: #f7f9fb;
  overflow: hidden;
}

.app-screenshot-card img {
  display: block;
  width: 100%;
  height: auto;
}

.workflow-screenshot-card {
  width: min(100%, 620px);
  padding: 0;
  background: #fff;
}

.workflow-screenshot-card img {
  display: block;
  width: 100%;
  height: auto;
}

.workflow-screenshot-card-tall {
  width: min(100%, 430px);
  margin-inline: auto;
}

.workflow-tabs {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

@media (max-width: 980px) {
  .workflow-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .workflow-tabs {
    grid-template-columns: 1fr;
  }
}

/* =====================================================
   PRODUCT REFRESH V6 — recreated product estimations
   Built from the supplied screenshots, without embedding them.
   ===================================================== */

/* Main preview: Portfolio Settings */
.settings-preview-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.settings-preview-card {
  position: relative;
  border: 1px solid #dce3e7;
  border-radius: 9px;
  background: #fff;
  padding: 10px;
}

.settings-preview-card.compact {
  min-height: 62px;
}

.settings-preview-card.wide {
  grid-column: 1 / -1;
}

.settings-preview-card strong {
  color: #253844;
  font-size: 7.5px;
}

.settings-preview-card > small {
  display: block;
  margin-top: 5px;
  color: #82919a;
  font-size: 6px;
}

.settings-preview-card.compact .panel-status {
  position: absolute;
  top: 9px;
  right: 9px;
}

.settings-preview-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: 1px solid #edf0f2;
}

.panel-status {
  display: inline-flex;
  align-items: center;
  width: max-content;
  border-radius: 999px;
  padding: 3px 6px;
  font-size: 5.8px;
  font-weight: 800;
  line-height: 1;
}

.panel-status.active {
  background: #168956;
  color: #fff;
}

.panel-status.checking {
  background: #6f7d85;
  color: #fff;
}

.panel-status.muted {
  background: #e8ecef;
  color: #64737c;
}

.toggle-row {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 8px 0;
  color: #546771;
  font-size: 6.4px;
}

.toggle {
  width: 18px;
  height: 10px;
  border-radius: 999px;
  background: #cfd7dc;
  position: relative;
  flex: 0 0 18px;
}

.toggle::after {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  left: 2px;
  top: 1.5px;
}

.toggle.on {
  background: #35a7e8;
}

.toggle.on::after {
  left: 9px;
}

.settings-form-grid {
  display: grid;
  grid-template-columns: 1.3fr .65fr .65fr;
  gap: 7px;
  margin-top: 10px;
}

.settings-form-grid label {
  display: block;
  color: #788790;
  font-size: 5.6px;
  font-weight: 700;
}

.settings-form-grid label:last-child {
  grid-column: 1 / -1;
}

.settings-form-grid b {
  display: block;
  margin-top: 4px;
  border: 1px solid #d9e0e4;
  border-radius: 5px;
  background: #fff;
  color: #344751;
  padding: 6px 7px;
  font-size: 6px;
  font-weight: 600;
}

/* Main preview: Market Data */
.market-preview-status {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 7px;
  margin-bottom: 8px;
}

.market-preview-status article {
  min-height: 58px;
  border: 1px solid #dce3e7;
  border-radius: 8px;
  background: #fff;
  padding: 8px;
}

.market-preview-status span,
.market-preview-status strong,
.market-preview-status small {
  display: block;
}

.market-preview-status span {
  color: #71818b;
  font-size: 5.8px;
}

.market-preview-status strong {
  margin-top: 4px;
  color: #243844;
  font-size: 9px;
}

.market-preview-status small {
  margin-top: 3px;
  color: #8b979e;
  font-size: 5.4px;
}

.market-preview-table,
.positions-preview-table {
  border: 1px solid #dce3e7;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.preview-table-head,
.market-preview-table > div,
.positions-preview-table > div {
  display: grid;
  align-items: center;
  gap: 8px;
}

.market-preview-table .preview-table-head,
.market-preview-table > div {
  grid-template-columns: .7fr .55fr .7fr .85fr .5fr;
}

.positions-preview-table .preview-table-head,
.positions-preview-table > div {
  grid-template-columns: .55fr 1.2fr .45fr .7fr .9fr .55fr;
}

.preview-table-head {
  padding: 7px 8px;
  background: #f3f5f6;
  color: #566874;
  font-size: 5.8px;
  font-weight: 800;
}

.market-preview-table > div:not(.preview-table-head),
.positions-preview-table > div:not(.preview-table-head) {
  padding: 7px 8px;
  border-top: 1px solid #edf0f2;
  color: #667780;
  font-size: 5.8px;
}

.market-preview-table strong,
.positions-preview-table strong {
  color: #263944;
  font-size: 6.1px;
}

.market-preview-table b,
.positions-preview-table b {
  color: #263944;
  font-size: 5.8px;
}

.status-warn {
  justify-self: start;
  padding: 3px 5px;
  border-radius: 4px;
  background: #f6c323;
  color: #433900 !important;
}

/* Main preview: Positions */
.positions-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  padding: 9px 10px;
  border: 1px solid #b8dfe8;
  border-radius: 8px;
  background: #d8f4fb;
}

.positions-banner strong {
  color: #235766;
  font-size: 6.6px;
}

.positions-banner small {
  color: #5d7880;
  font-size: 5.6px;
}

.mini-action-row {
  display: flex;
  gap: 4px;
}

/* Workflow: recreated Workspace */
.wf-workspace-estimate {
  background: #f6f8fa;
}

.wf-workspace-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 13px;
}

.wf-var-panel,
.wf-sensitivity-panel {
  border: 1px solid #dce3e7;
  border-radius: 10px;
  background: #fff;
  padding: 11px;
}

.wf-panel-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}

.wf-panel-title strong {
  color: #263944;
  font-size: 8px;
}

.wf-panel-title span {
  border-radius: 5px;
  background: #ffd647;
  color: #463c12;
  padding: 3px 5px;
  font-size: 5.8px;
  font-weight: 800;
}

.wf-var-panel > small,
.wf-sensitivity-panel > small {
  display: block;
  margin-top: 4px;
  color: #778790;
  font-size: 6px;
}

.wf-var-panel svg {
  width: 100%;
  height: 132px;
  margin-top: 5px;
}

.wf-grid-line {
  stroke: #dfe5e8;
  stroke-width: 1;
}

.wf-var-curve {
  fill: none;
  stroke: #1e72f4;
  stroke-width: 2.3;
}

.wf-var-marker {
  stroke: #e63249;
  stroke-width: 1.4;
  stroke-dasharray: 4 3;
}

.wf-cvar-marker {
  stroke: #6d4bd0;
  stroke-width: 1.4;
  stroke-dasharray: 4 3;
}

.wf-mini-pie-row {
  display: grid;
  grid-template-columns: 62px 1fr;
  gap: 8px;
  align-items: center;
}

.wf-mini-pie {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  background: conic-gradient(#198b55 0 21%, #df3448 21% 50%, #6540c5 50% 61%, #ff8318 61% 71%, #1dbbd4 71% 80%, #d42d7b 80% 89%, #7a858d 89% 95%, #24bd97 95% 100%);
}

.wf-mini-pie-row span {
  display: block;
  margin: 4px 0;
  color: #6d7c85;
  font-size: 5.9px;
}

.wf-surface {
  height: 145px;
  margin-top: 12px;
  border: 1px solid #e2e7e9;
  border-radius: 8px;
  background: linear-gradient(155deg, #f04a20 0%, #f4d71e 24%, #46cf3a 50%, #1dbfe1 74%, #2f61cc 100%);
  transform: perspective(350px) rotateX(55deg) rotateZ(-7deg) scale(.9);
  transform-origin: center;
  position: relative;
  overflow: hidden;
}

.wf-surface::before,
.wf-surface::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.22) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.22) 1px, transparent 1px);
  background-size: 24px 24px;
}

.wf-surface-axis {
  display: flex;
  justify-content: space-between;
  color: #7b8992;
  font-size: 5.8px;
}

/* Workflow: recreated Tasks */
.wf-tasks-estimate {
  padding: 12px;
  background: #f6f8fa;
}

.wf-task-toolbar {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 9px;
}

.wf-task-toolbar span,
.wf-task-toolbar b {
  padding: 6px 8px;
  border: 1px solid #cfd8dd;
  background: #fff;
  color: #5b6c76;
  font-size: 6px;
  font-weight: 700;
}

.wf-task-toolbar .active {
  background: #42515a;
  color: #fff;
  border-color: #42515a;
}

.wf-task-toolbar b {
  margin-left: auto;
  border-radius: 5px;
  background: #35a7e8;
  border-color: #35a7e8;
  color: #fff;
}

.wf-task-estimate-card {
  border: 1px solid #dce3e7;
  border-radius: 10px;
  background: #fff;
  padding: 10px;
  margin-top: 9px;
}

.wf-task-estimate-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: flex-start;
}

.wf-task-estimate-head > div {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}

.wf-task-estimate-head strong {
  color: #263944;
  font-size: 7.6px;
}

.wf-task-estimate-head em {
  font-style: normal;
  border-radius: 4px;
  background: #168956;
  color: #fff;
  padding: 3px 5px;
  font-size: 5.4px;
  font-weight: 800;
}

.wf-task-estimate-head small {
  flex-basis: 100%;
  color: #83919a;
  font-size: 5.7px;
}

.wf-task-estimate-head > span {
  border: 1px solid #c7d0d5;
  border-radius: 5px;
  padding: 5px 7px;
  color: #536570;
  font-size: 5.8px;
}

.wf-task-estimate-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 12px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid #edf0f2;
}

.wf-task-estimate-meta label {
  color: #73828b;
  font-size: 5.3px;
  letter-spacing: .03em;
}

.wf-task-estimate-meta b {
  display: block;
  margin-top: 3px;
  color: #2b3e49;
  font-size: 6px;
}

/* Workflow: recreated Live Monitor */
.wf-live-estimate {
  padding: 12px;
  background: #f6f8fa;
}

.wf-live-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.wf-live-head strong,
.wf-live-head small {
  display: block;
}

.wf-live-head strong {
  color: #263944;
  font-size: 9px;
}

.wf-live-head small {
  color: #82919a;
  font-size: 6px;
}

.wf-live-head > span {
  border-radius: 4px;
  background: #168956;
  color: #fff;
  padding: 3px 6px;
  font-size: 5.8px;
  font-weight: 800;
}

.wf-live-grid {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 10px;
}

.wf-live-treemap {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  height: 210px;
  gap: 3px;
}

.wf-live-treemap i {
  display: grid;
  place-items: center;
  align-content: center;
  background: #3f9163;
  color: #fff;
  font-style: normal;
  font-size: 10px;
  font-weight: 800;
}

.wf-live-treemap i.big {
  grid-row: 1 / 3;
  font-size: 14px;
}

.wf-live-treemap i.gain {
  background: #27bd59;
}

.wf-live-treemap i.loss {
  background: #9a4f5d;
}

.wf-live-treemap small {
  display: block;
  margin-top: 4px;
  font-size: 5.8px;
  font-weight: 600;
}

.wf-live-risk {
  border: 1px solid #dce3e7;
  border-radius: 9px;
  background: #fff;
  padding: 10px;
}

.wf-live-risk strong,
.wf-live-risk span {
  display: block;
}

.wf-live-risk strong {
  color: #253844;
  font-size: 7.5px;
}

.wf-live-risk svg {
  width: 100%;
  height: 150px;
  margin-top: 5px;
}

.wf-live-risk span {
  color: #e23b4c;
  font-size: 6.4px;
}

/* Workflow: recreated Ciro */
.wf-ciro-estimate {
  width: min(100%, 420px);
  background: #fff;
}

.wf-ciro-head {
  padding: 12px 13px;
  border-bottom: 1px solid #e1e6e9;
}

.wf-ciro-head strong,
.wf-ciro-head small {
  display: block;
}

.wf-ciro-head strong {
  color: #20333f;
  font-size: 9px;
}

.wf-ciro-head small {
  margin-top: 2px;
  color: #82919a;
  font-size: 6px;
}

.wf-ciro-tabs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-bottom: 1px solid #e3e8ea;
}

.wf-ciro-tabs span {
  text-align: center;
  padding: 8px 4px;
  color: #70818c;
  font-size: 6px;
  border-bottom: 2px solid transparent;
}

.wf-ciro-tabs .active {
  color: #243743;
  border-bottom-color: #243743;
  font-weight: 800;
}

.wf-ciro-budget {
  padding: 10px 12px 6px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 8px;
  color: #667984;
  font-size: 6px;
}

.wf-ciro-budget i {
  grid-column: 1 / -1;
  height: 5px;
  border-radius: 999px;
  overflow: hidden;
  background: #e6eaed;
}

.wf-ciro-budget em {
  display: block;
  width: 47%;
  height: 100%;
  background: #36a7ea;
}

.wf-ciro-chat {
  padding: 9px 11px 12px;
}

.wf-ciro-user,
.wf-ciro-answer {
  border-radius: 8px;
  padding: 9px;
  margin: 7px 0;
  color: #435660;
  font-size: 6.2px;
  line-height: 1.45;
}

.wf-ciro-user {
  background: #e8eef5;
}

.wf-ciro-answer {
  border: 1px solid #e1e7ea;
  background: #fbfcfd;
}

.wf-ciro-user b,
.wf-ciro-answer b,
.wf-ciro-answer small {
  display: block;
  margin-top: 3px;
}

.wf-ciro-answer small {
  color: #7c8a92;
  font-size: 5.7px;
}

/* 5-step workflow tabs */
.workflow-tabs {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

@media (max-width: 980px) {
  .settings-preview-grid,
  .market-preview-status,
  .wf-workspace-grid,
  .wf-live-grid {
    grid-template-columns: 1fr;
  }

  .settings-form-grid {
    grid-template-columns: 1fr 1fr;
  }

  .market-preview-table .preview-table-head,
  .market-preview-table > div,
  .positions-preview-table .preview-table-head,
  .positions-preview-table > div {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .market-preview-table .preview-table-head > *:nth-child(4),
  .market-preview-table .preview-table-head > *:nth-child(5),
  .market-preview-table > div > *:nth-child(4),
  .market-preview-table > div > *:nth-child(5),
  .positions-preview-table .preview-table-head > *:nth-child(4),
  .positions-preview-table .preview-table-head > *:nth-child(5),
  .positions-preview-table .preview-table-head > *:nth-child(6),
  .positions-preview-table > div > *:nth-child(4),
  .positions-preview-table > div > *:nth-child(5),
  .positions-preview-table > div > *:nth-child(6) {
    display: none;
  }

  .workflow-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .workflow-tabs {
    grid-template-columns: 1fr;
  }

  .settings-form-grid,
  .wf-task-estimate-meta {
    grid-template-columns: 1fr;
  }
}

/* Workspace curve detail enhancement */
.analytical-chart-card-detail {
  padding-bottom: 9px;
}
.chart-title-detail {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.chart-title-detail small {
  color: #7f8f98;
  font-size: 5.4px;
  font-weight: 600;
}
.var-distribution-chart-detail {
  height: 132px;
}
.var-grid line {
  stroke: #e7ecef;
  stroke-width: 1;
}
.var-y-axis-labels text,
.axis-title-y,
.axis-title-x {
  fill: #8a98a0;
  font-size: 5.5px;
  font-weight: 600;
}
.var-area {
  fill: rgba(30, 113, 242, 0.12);
}
.var-tail-area {
  fill: rgba(28, 141, 88, 0.16);
}
.var-point {
  fill: #ef3446;
  stroke: #ffffff;
  stroke-width: 1.2;
}
.cvar-point {
  fill: #7654d6;
  stroke: #ffffff;
  stroke-width: 1.2;
}
.var-metric-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  margin-top: 6px;
}
.var-metric-row span {
  padding: 4px 5px;
  border: 1px solid #e2e7ea;
  border-radius: 6px;
  background: #f7f9fb;
  color: #677983;
  font-size: 5.2px;
  line-height: 1.35;
}
.var-metric-row b {
  color: #213540;
}
@media (max-width: 760px) {
  .var-metric-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Richer workflow workspace/live visuals */
.wf-axis-copy,
.wf-axis-title,
.wf-var-copy,
.wf-cvar-copy {
  font-size: 5.6px;
  font-weight: 700;
}
.wf-axis-copy,
.wf-axis-title {
  fill: #7f8d96;
}
.wf-var-copy {
  fill: #e63249;
}
.wf-cvar-copy {
  fill: #6d4bd0;
}
.wf-axis-line {
  stroke: #cdd5d9;
  stroke-width: 1;
}
.wf-var-area {
  fill: rgba(30, 114, 244, 0.14);
}
.wf-var-tail-area {
  fill: rgba(28, 141, 88, 0.18);
}
.wf-var-tail {
  fill: none;
  stroke: #1c8d58;
  stroke-width: 2.1;
}
.wf-var-dot {
  fill: #e63249;
  stroke: #fff;
  stroke-width: 1.1;
}
.wf-cvar-dot {
  fill: #6d4bd0;
  stroke: #fff;
  stroke-width: 1.1;
}
.wf-var-stats,
.wf-sensitivity-stats,
.wf-live-metrics,
.wf-live-risk-stats {
  display: grid;
  gap: 6px;
}
.wf-var-stats {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 6px 0 8px;
}
.wf-sensitivity-stats,
.wf-live-metrics,
.wf-live-risk-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 8px;
}
.wf-var-stats span,
.wf-sensitivity-stats span,
.wf-live-metrics span,
.wf-live-risk-stats span {
  border: 1px solid #dce3e7;
  border-radius: 7px;
  background: #f8fafb;
  color: #6d7c85;
  padding: 6px 7px;
  font-size: 5.8px;
  line-height: 1.35;
}
.wf-var-stats b,
.wf-sensitivity-stats b,
.wf-live-metrics b,
.wf-live-risk-stats b {
  color: #243844;
}
.wf-live-treemap-wrap {
  display: grid;
  gap: 8px;
}
.wf-live-risk small {
  display: block;
  margin-top: 3px;
  color: #7d8b94;
  font-size: 5.9px;
}
@media (max-width: 980px) {
  .wf-var-stats,
  .wf-sensitivity-stats,
  .wf-live-risk-stats,
  .wf-live-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 560px) {
  .wf-var-stats,
  .wf-sensitivity-stats,
  .wf-live-risk-stats,
  .wf-live-metrics {
    grid-template-columns: 1fr;
  }
}