/* ─── HERO PANEL — CRM pipeline visual ─── */
.cfa-crm-panel {
  background: var(--ink); border-radius: var(--r-xl); padding: var(--card-pad);
  border: 1px solid rgba(255,255,255,0.08); box-shadow: var(--shadow-lg);
  position: relative; overflow: hidden; min-height: 360px;
}
.cfa-crm-panel::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse 55% 50% at 85% 90%, rgba(200,255,0,0.07), transparent 60%);
}
.cfa-panel-header { display: flex; align-items: center; gap: var(--space-sm); margin-bottom: var(--space-md); position: relative; z-index: 1; }
.cfa-panel-dot { width: 10px; height: 10px; border-radius: 999px; flex-shrink: 0; }
.cfa-panel-dot:nth-child(1) { background: #FF5F57; }
.cfa-panel-dot:nth-child(2) { background: #FEBC2E; }
.cfa-panel-dot:nth-child(3) { background: #28C840; }
.cfa-panel-title { margin-left: auto; font-size: 11px; font-weight: 700; color: rgba(255,255,255,0.4); }

/* Pipeline stages */
.cfa-pipeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-xs); margin-bottom: var(--space-sm); position: relative; z-index: 1; }
.cfa-stage-col { display: flex; flex-direction: column; gap: var(--space-xs); }
.cfa-stage-label { font-size: 9.5px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255,255,255,0.4); margin-bottom: var(--space-xs); }
.cfa-stage-card {
  background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--r-sm); padding: 9px 10px;
  transition: background 200ms;
}
.cfa-stage-card:hover { background: rgba(255,255,255,0.1); }
.cfa-stage-card-name { font-size: 11px; font-weight: 800; color: rgba(255,255,255,0.85); }
.cfa-stage-card-meta { font-size: 10px; font-weight: 700; color: rgba(255,255,255,0.4); margin-top: 2px; }
.cfa-stage-card-val  { font-size: 12px; font-weight: 900; color: var(--accent); margin-top: var(--space-xs); }

/* Automation trigger row */
.cfa-trigger-row {
  display: flex; align-items: center; gap: var(--space-sm); position: relative; z-index: 1;
  background: rgba(200,255,0,0.08); border: 1px solid rgba(200,255,0,0.18);
  border-radius: var(--r-md); padding: 11px 14px;
}
.cfa-trigger-row span { font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.65); flex: 1; }
.cfa-trigger-badge { font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; color: var(--accent); background: rgba(200,255,0,0.12); padding: 3px 8px; border-radius: 100px; }

/* ─── WHAT IS SECTION ─── */
.cfa-what-section { padding-top: var(--section-py); padding-bottom: var(--section-py); }
.cfa-what-grid { display: grid; gap: var(--grid-gap-lg); align-items: center; }
@media (min-width: 1024px) { .cfa-what-grid { grid-template-columns: 1fr 1fr; } }
.cfa-what-visual {
  border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--line);
  box-shadow: var(--shadow-lg); min-height: 440px; position: relative; background: var(--surface-2);
}
.cfa-what-visual img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.cfa-what-badge {
  position: absolute; bottom: 20px; left: 20px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 14px 18px; box-shadow: var(--shadow-md);
  display: flex; align-items: center; gap: var(--space-sm);
}
.cfa-what-badge-icon { width: 34px; height: 34px; border-radius: var(--r-sm); background: var(--accent); color: #000; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 900; flex-shrink: 0; }
.cfa-what-badge strong { display: block; font-size: 18px; font-weight: 900; color: var(--ink); line-height: 1; }
.cfa-what-badge span   { display: block; font-size: 11.5px; font-weight: 700; color: var(--ink-faint); margin-top: 3px; }
.cfa-compare { border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; margin-top: var(--space-lg); box-shadow: var(--shadow-sm); }
.cfa-compare-header { display: grid; grid-template-columns: 1fr 1fr; }
.cfa-compare-header > div { padding: 10px 16px; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.09em; border-right: 1px solid var(--line); }
.cfa-compare-header > div:first-child { background: rgba(239,68,68,0.07); color: #b91c1c; }
.cfa-compare-header > div:last-child  { background: rgba(91,71,224,0.07);  color: var(--primary); border-right: none; }
.cfa-compare-row { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.cfa-compare-cell { padding: 11px 16px; font-size: 13px; font-weight: 700; color: var(--ink-muted); border-right: 1px solid var(--line); line-height: 1.4; display: flex; align-items: center; gap: var(--space-sm); }
.cfa-compare-cell:last-child { border-right: none; }
.cfa-cc { color: #16a34a; font-size: 13px; flex-shrink: 0; }
.cfa-cx { color: #dc2626; font-size: 13px; flex-shrink: 0; }
.cfa-stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--grid-gap-sm); margin-top: var(--space-lg); }
.cfa-stat-item { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface-2); padding: 16px; text-align: center; transition: border-color 180ms, box-shadow 180ms; }
.cfa-stat-item:hover { border-color: rgba(91,71,224,0.22); box-shadow: var(--shadow-sm); }
.cfa-stat-item strong { display: block; font-size: 26px; font-weight: 900; color: var(--primary); line-height: 1; letter-spacing: -0.03em; }
.cfa-stat-item span   { display: block; font-size: 11.5px; font-weight: 700; color: var(--ink-faint); margin-top: var(--space-xs); line-height: 1.4; }

/* ─── WHY (dark) ─── */
.cfa-why-section { padding-top: var(--section-py); padding-bottom: var(--section-py); background: var(--ink); position: relative; overflow: hidden; }
.cfa-why-section::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 50% 55% at 90% 20%, rgba(91,71,224,0.16), transparent 60%), radial-gradient(ellipse 35% 45% at 8% 80%, rgba(200,255,0,0.06), transparent 60%); pointer-events: none; }
.cfa-why-section .eyebrow { color: var(--accent); }
.cfa-why-section .eyebrow::before { background: var(--accent); }
.cfa-why-section .section-heading h2 { color: #fff; }
.cfa-why-section .section-heading p   { color: rgba(255,255,255,0.58); }
.cfa-why-inner { position: relative; z-index: 1; }
.cfa-why-grid { display: grid; gap: var(--space-md); margin-top: var(--heading-gap); }
@media (min-width: 640px)  { .cfa-why-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .cfa-why-grid { grid-template-columns: repeat(3, 1fr); } }
.cfa-why-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.09); border-radius: var(--r-lg); padding: var(--card-pad); transition: background 200ms, border-color 200ms, transform 200ms; }
.cfa-why-card:hover { background: rgba(255,255,255,0.09); border-color: rgba(200,255,0,0.2); transform: translateY(-3px); }
.cfa-why-icon { font-size: 26px; margin-bottom: var(--space-sm); display: block; }
.cfa-why-card h3 { font-size: 17px; font-weight: 800; color: #fff; letter-spacing: -0.015em; margin-bottom: var(--space-sm); }
.cfa-why-card p  { font-size: 13.5px; color: rgba(255,255,255,0.52); line-height: 1.72; margin: 0; }
.cfa-why-stat    { display: inline-block; margin-top: var(--space-sm); font-size: 32px; font-weight: 900; color: var(--accent); letter-spacing: -0.03em; line-height: 1; }
.cfa-why-stat-l  { display: block; font-size: 11.5px; font-weight: 700; color: rgba(255,255,255,0.4); margin-top: 3px; }

/* ─── SERVICES — reuses ais-grid + ais-card ─── */
.cfa-services-section { padding-top: var(--section-py); padding-bottom: var(--section-py); background: var(--surface-2); }
.cfa-featured-card { grid-column: 1 / -1; border: 1.5px solid rgba(91,71,224,0.25); border-radius: var(--r-xl); background: var(--surface); overflow: hidden; display: grid; box-shadow: var(--shadow-md); transition: box-shadow 220ms, border-color 220ms; margin-bottom: var(--space-xs); }
.cfa-featured-card:hover { box-shadow: var(--shadow-lg); border-color: rgba(91,71,224,0.35); }
@media (min-width: 1024px) { .cfa-featured-card { grid-template-columns: 1fr 380px; } }
.cfa-featured-body { padding: 40px; display: flex; flex-direction: column; background: linear-gradient(135deg, var(--primary-light) 0%, var(--surface) 100%); }
.cfa-featured-body h3 { font-size: clamp(20px, 2.2vw, 28px); font-weight: 800; letter-spacing: -0.025em; margin: var(--space-sm) 0 14px; }
.cfa-featured-body p  { font-size: 15px; color: var(--ink-muted); line-height: 1.75; margin-bottom: var(--space-md); flex: 1; }
.cfa-featured-panel { background: var(--ink); position: relative; overflow: hidden; min-height: 240px; padding: var(--card-pad); }
.cfa-featured-panel::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 50% at 80% 80%, rgba(200,255,0,0.08), transparent 60%); }
.cfa-flow { display: grid; gap: 7px; position: relative; z-index: 1; }
.cfa-flow-item { display: flex; align-items: center; gap: var(--space-sm); background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--r-sm); padding: 10px 13px; transition: background 200ms; }
.cfa-flow-item:hover { background: rgba(255,255,255,0.1); }
.cfa-flow-icon { width: 26px; height: 26px; border-radius: 6px; background: rgba(200,255,0,0.12); color: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; }
.cfa-flow-label { flex: 1; font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.8); }
.cfa-flow-badge { padding: 3px 8px; border-radius: 100px; background: rgba(200,255,0,0.12); color: var(--accent); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.06em; }

/* ─── CRM PLATFORMS ─── */
.cfa-platforms-section { padding-top: var(--section-py); padding-bottom: var(--section-py); }
.cfa-platforms-grid { display: grid; gap: var(--grid-gap-sm); margin-top: var(--heading-gap); }
@media (min-width: 480px) { .cfa-platforms-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .cfa-platforms-grid { grid-template-columns: repeat(5, 1fr); } }
.cfa-platform-chip { display: flex; align-items: center; gap: var(--grid-gap-sm); padding: 16px 18px; border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-sm); transition: border-color 180ms, box-shadow 180ms, background 180ms; cursor: default; }
.cfa-platform-chip:hover { border-color: rgba(91,71,224,0.3); box-shadow: var(--shadow-md); background: var(--primary-light); }
.cfa-platform-chip-icon { font-size: 22px; flex-shrink: 0; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; }
.cfa-platform-chip h3 { font-size: 14px; font-weight: 800; color: var(--ink); }
.cfa-platform-chip p  { font-size: 11.5px; color: var(--ink-faint); font-weight: 700; margin-top: 2px; }

/* ─── CHALLENGES ─── */
.cfa-challenges-section { padding-top: var(--section-py); padding-bottom: var(--section-py); background: var(--surface-2); }
.cfa-challenges-layout { display: grid; gap: var(--grid-gap-lg); align-items: center; margin-top: var(--heading-gap); }
@media (min-width: 1024px) { .cfa-challenges-layout { grid-template-columns: 1fr 1fr; } }
.cfa-challenges-visual { border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow-lg); min-height: 440px; position: relative; background: var(--surface-2); }
.cfa-challenges-visual img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.cfa-challenges-metrics { position: absolute; bottom: 20px; left: 20px; right: 20px; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-sm); }
.cfa-ch-metric { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: 12px; text-align: center; box-shadow: var(--shadow-sm); }
.cfa-ch-metric strong { display: block; font-size: 20px; font-weight: 900; color: var(--primary); line-height: 1; letter-spacing: -0.025em; }
.cfa-ch-metric span   { display: block; font-size: 10.5px; font-weight: 700; color: var(--ink-faint); margin-top: var(--space-xs); line-height: 1.3; }
.cfa-solve-list { display: grid; gap: var(--grid-gap-sm); }
.cfa-solve-item { display: grid; grid-template-columns: 44px 1fr; gap: var(--space-md); align-items: start; padding: 18px 22px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow-sm); transition: transform 180ms, border-color 180ms, box-shadow 180ms; }
.cfa-solve-item:hover { transform: translateX(5px); border-color: rgba(91,71,224,0.22); box-shadow: var(--shadow-md); }
.cfa-solve-icon { width: 40px; height: 40px; border-radius: var(--r-sm); background: var(--primary-light); color: var(--primary); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
.cfa-solve-item h3 { font-size: 15px; font-weight: 800; letter-spacing: -0.01em; margin-bottom: 5px; }
.cfa-solve-item p  { font-size: 13px; color: var(--ink-muted); line-height: 1.65; margin: 0; }

/* ─── PROCESS (dark) ─── */
.cfa-process-section { padding-top: var(--section-py); padding-bottom: var(--section-py); background: var(--ink); position: relative; overflow: hidden; }
.cfa-process-section::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 40% 50% at 90% 20%, rgba(91,71,224,0.15), transparent 60%), radial-gradient(ellipse 30% 40% at 10% 80%, rgba(200,255,0,0.06), transparent 60%); pointer-events: none; }
.cfa-process-section .eyebrow { color: var(--accent); }
.cfa-process-section .eyebrow::before { background: var(--accent); }
.cfa-process-section .section-heading h2 { color: #fff; }
.cfa-process-section .section-heading p   { color: rgba(255,255,255,0.58); }
.cfa-process-inner { position: relative; z-index: 1; }
.cfa-process-steps { display: grid; gap: 0; margin-top: var(--heading-gap); border: 1px solid rgba(255,255,255,0.08); border-radius: var(--r-xl); overflow: hidden; position: relative; z-index: 1; }
@media (min-width: 640px)  { .cfa-process-steps { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1280px) { .cfa-process-steps { grid-template-columns: repeat(4, 1fr); } }
.cfa-pstep { padding: var(--card-pad) 26px; border-right: 1px solid rgba(255,255,255,0.07); border-bottom: 1px solid rgba(255,255,255,0.07); background: rgba(255,255,255,0.03); transition: background 200ms; }
.cfa-pstep:hover { background: rgba(255,255,255,0.07); }
.cfa-pstep-num { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: rgba(200,255,0,0.12); color: var(--accent); font-size: 14px; font-weight: 900; margin-bottom: var(--space-sm); border: 1px solid rgba(200,255,0,0.2); }
.cfa-pstep h3 { font-size: 15px; font-weight: 800; color: #fff; letter-spacing: -0.015em; margin-bottom: var(--space-xs); }
.cfa-pstep p  { font-size: 13px; color: rgba(255,255,255,0.52); line-height: 1.72; margin: 0; }

/* ─── WHY CHOOSE ─── */
.cfa-choose-section { padding-top: var(--section-py); padding-bottom: var(--section-py); }
.cfa-choose-layout { display: grid; gap: var(--grid-gap-lg); align-items: center; margin-top: var(--heading-gap); }
@media (min-width: 1024px) { .cfa-choose-layout { grid-template-columns: 1fr 1fr; } }
.cfa-choose-visual { border-radius: var(--r-xl); overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow-lg); min-height: 440px; position: relative; background: var(--surface-2); }
.cfa-choose-visual img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.cfa-choose-stats { position: absolute; bottom: 20px; left: 20px; right: 20px; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-sm); }
.cfa-choose-stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: 12px; text-align: center; box-shadow: var(--shadow-sm); }
.cfa-choose-stat strong { display: block; font-size: 20px; font-weight: 900; color: var(--primary); line-height: 1; letter-spacing: -0.025em; }
.cfa-choose-stat span   { display: block; font-size: 10.5px; font-weight: 700; color: var(--ink-faint); margin-top: var(--space-xs); line-height: 1.3; }
.cfa-choose-pillars { display: grid; gap: var(--grid-gap-sm); }
.cfa-choose-pillar { display: grid; grid-template-columns: 44px 1fr; gap: var(--space-md); align-items: start; padding: 18px 22px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); box-shadow: var(--shadow-sm); transition: transform 180ms, border-color 180ms, box-shadow 180ms; }
.cfa-choose-pillar:hover { transform: translateX(5px); border-color: rgba(91,71,224,0.22); box-shadow: var(--shadow-md); }
.cfa-choose-icon { width: 40px; height: 40px; border-radius: var(--r-sm); background: var(--primary-light); color: var(--primary); display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
.cfa-choose-pillar h3 { font-size: 15px; font-weight: 800; letter-spacing: -0.01em; margin-bottom: 5px; }
.cfa-choose-pillar p  { font-size: 13px; color: var(--ink-muted); line-height: 1.65; margin: 0; }

/* ─── USE CASES ─── */
.cfa-use-cases-section { padding-top: var(--section-py); padding-bottom: var(--section-py); background: var(--surface-2); }
.cfa-use-cases-grid { display: grid; gap: var(--space-md); margin-top: var(--heading-gap); }
@media (min-width: 640px)  { .cfa-use-cases-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .cfa-use-cases-grid { grid-template-columns: repeat(4, 1fr); } }
.cfa-use-case { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: var(--card-pad); box-shadow: var(--shadow-sm); position: relative; overflow: hidden; transition: transform 180ms, border-color 180ms, box-shadow 180ms; }
.cfa-use-case::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--primary-light); transition: background 200ms; }
.cfa-use-case:hover { transform: translateY(-3px); border-color: rgba(91,71,224,0.2); box-shadow: var(--shadow-md); }
.cfa-use-case:hover::before { background: var(--primary); }
.cfa-uc-icon { font-size: 26px; margin-bottom: var(--space-sm); display: block; }
.cfa-use-case h3 { font-size: 15px; font-weight: 800; letter-spacing: -0.01em; margin-bottom: var(--space-xs); color: var(--ink); }
.cfa-use-case p  { font-size: 13px; color: var(--ink-muted); line-height: 1.68; margin: 0; }

/* ─── INDUSTRIES ─── */
.cfa-industries-section { padding-top: var(--section-py); padding-bottom: var(--section-py); }
.cfa-industries-grid { display: grid; gap: var(--space-sm); margin-top: var(--heading-gap); }
@media (min-width: 480px) { .cfa-industries-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) { .cfa-industries-grid { grid-template-columns: repeat(5, 1fr); } }
.cfa-industry-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 20px 14px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--space-sm); box-shadow: var(--shadow-sm); transition: transform 180ms, border-color 180ms, box-shadow 180ms, background 180ms; }
.cfa-industry-card:hover { transform: translateY(-3px); border-color: rgba(91,71,224,0.22); box-shadow: var(--shadow-md); background: var(--primary-light); }
.cfa-industry-icon { font-size: 26px; }
.cfa-industry-card h3 { font-size: 13.5px; font-weight: 800; color: var(--ink); line-height: 1.3; }

/* ─── FAQ ─── */
.cfa-faq-layout { display: grid; gap: var(--grid-gap-lg); align-items: start; margin-top: var(--heading-gap); }
@media (min-width: 1024px) { .cfa-faq-layout { grid-template-columns: 300px 1fr; } }
.cfa-faq-sidebar { background: var(--primary-light); border: 1px solid rgba(91,71,224,0.15); border-radius: var(--r-xl); padding: var(--card-pad); position: sticky; top: 100px; }
.cfa-faq-sidebar h3 { font-size: 18px; font-weight: 800; letter-spacing: -0.015em; color: var(--ink); margin-bottom: var(--space-sm); }
.cfa-faq-sidebar p  { font-size: 14px; color: var(--ink-muted); line-height: 1.72; margin-bottom: var(--space-md); }
.cfa-faq-trust { display: grid; gap: var(--space-sm); margin-top: var(--space-md); }
.cfa-faq-trust-row { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 700; color: var(--ink-muted); }
.cfa-faq-trust-row::before { content: '✓'; display: inline-flex; width: 20px; height: 20px; align-items: center; justify-content: center; border-radius: 999px; background: var(--accent); color: #000; font-size: 11px; font-weight: 900; flex-shrink: 0; }

/* ─── RESPONSIVE ─── */
@media (max-width: 767px) {
  .cfa-pipeline { grid-template-columns: repeat(2, 1fr); }
  .cfa-stats-row { grid-template-columns: 1fr; }
  .cfa-choose-stats, .cfa-challenges-metrics { grid-template-columns: 1fr 1fr; }
  .cfa-process-steps { grid-template-columns: 1fr; }
  .cfa-pstep { border-right: none; }
}
@media (max-width: 479px) {
  .cfa-pipeline { grid-template-columns: 1fr; }
  .cfa-industries-grid, .cfa-platforms-grid { grid-template-columns: 1fr 1fr; }
}
