/* Workflow & AI correspondence landing page */
.workflow-page {
    --flow: #2563eb;
    --flow-light: #8bb5ff;
    --flow-soft: #eaf2ff;
    --violet: #7c63ee;
}

.workflow-page .hero {
    background:
        radial-gradient(circle at 13% 23%, rgba(124,99,238,.12), transparent 28%),
        radial-gradient(circle at 75% 35%, rgba(37,99,235,.08), transparent 31%),
        linear-gradient(135deg,#fbfdff 0%,#f2f6fd 58%,#eaf1fb 100%);
}
.workflow-page .hero::before { border-color: rgba(37,99,235,.13); box-shadow: 0 0 0 95px rgba(37,99,235,.025),0 0 0 190px rgba(124,99,238,.018); }
.workflow-page .hero::after { background-image: linear-gradient(rgba(37,99,235,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.1) 1px,transparent 1px); }
.workflow-page .eyebrow { color: var(--violet); background: rgba(124,99,238,.08); border-color: rgba(124,99,238,.12); }
.workflow-page .eyebrow span { background: var(--violet); box-shadow: 0 0 0 5px rgba(124,99,238,.11); }
.workflow-page .hero h1 { font-size: clamp(40px,4.4vw,62px); line-height: 1.3; letter-spacing: -2.4px; }
.workflow-page .hero h1 em { color: var(--flow); }
.workflow-page .trust-strip i { color: var(--violet); }

.workflow-visual { min-height: 535px; position: relative; display: grid; place-items: center; direction: ltr; }
.workflow-glow { width: 500px; height: 500px; position: absolute; background: radial-gradient(circle,rgba(124,99,238,.17),rgba(37,99,235,.07) 42%,transparent 69%); filter: blur(15px); }
.workflow-photo { width: 92%; height: 475px; position: relative; z-index: 1; overflow: hidden; background: #17264d; border: 8px solid rgba(255,255,255,.94); border-radius: 30px; box-shadow: 0 38px 85px rgba(28,45,93,.22); transform: rotate(-1.4deg); }
.workflow-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 48%,rgba(7,23,44,.72)); pointer-events: none; }
.workflow-photo img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.workflow-photo figcaption { position: absolute; right: 20px; left: 20px; bottom: 16px; z-index: 2; display: flex; align-items: center; justify-content: space-between; color: white; direction: rtl; }
.workflow-photo figcaption span { display: flex; align-items: center; gap: 7px; font-size: 9px; font-weight: 800; }.workflow-photo figcaption i { color: #b9aeff; }
.workflow-photo figcaption small { color: rgba(255,255,255,.58); font-size: 6px; letter-spacing: 1.5px; direction: ltr; }
.ai-desk { width: 330px; padding: 13px; position: absolute; right: -8px; bottom: 0; z-index: 3; color: var(--ink); background: rgba(255,255,255,.95); border: 1px solid white; border-radius: 17px; box-shadow: 0 24px 55px rgba(28,45,93,.24); backdrop-filter: blur(14px); }
.desk-header { padding: 1px 4px 15px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); font-size: 8px; font-weight: 900; letter-spacing: .8px; }
.desk-header > span { display: flex; align-items: center; gap: 7px; }.desk-header > span i { color: var(--violet); }
.desk-header em { display: flex; align-items: center; gap: 6px; color: #2e8b68; font-size: 7px; font-style: normal; }.desk-header em i { width: 6px; height: 6px; background: #42c691; border-radius: 50%; box-shadow: 0 0 0 4px rgba(66,198,145,.12); }
.mail-card { margin: 16px 0 10px; padding: 14px; display: flex; align-items: center; gap: 12px; background: #f2f5fa; border: 1px solid #e5ebf3; border-radius: 11px; direction: rtl; }
.mail-icon { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; color: var(--flow); background: #dce9ff; border-radius: 11px; }
.mail-card > div:last-child { display: flex; flex-direction: column; }.mail-card small { color: var(--muted); font-size: 7px; }.mail-card strong { margin: 2px 0; font-size: 10px; }.mail-card span { color: #738095; font-size: 7px; }
.ai-thinking { padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; color: #5f50b9; background: #f0edff; border: 1px solid #e3defd; border-radius: 9px; font-size: 7px; direction: rtl; }.ai-thinking span { display: flex; align-items: center; gap: 7px; }.ai-thinking b { display: flex; gap: 3px; direction: ltr; }.ai-thinking b i { width: 4px; height: 4px; background: var(--violet); border-radius: 50%; animation: aiDot 1.2s infinite; }.ai-thinking b i:nth-child(2) { animation-delay: .2s; }.ai-thinking b i:nth-child(3) { animation-delay: .4s; }
@keyframes aiDot { 50% { opacity: .25; transform: translateY(-3px); } }
.ai-results { margin: 10px 0; display: grid; grid-template-columns: 1.3fr .7fr 1fr; gap: 6px; direction: rtl; }
.ai-results div { padding: 10px; background: #f7f8fb; border: 1px solid #eaedf2; border-radius: 9px; }.ai-results small,.ai-results strong { display: block; }.ai-results small { color: #8a96a5; font-size: 6px; }.ai-results strong { margin-top: 3px; font-size: 8px; }.priority-high { width: fit-content; padding: 1px 6px; color: #c45f38; background: #fff0e8; border-radius: 10px; }
.ai-action { padding: 10px 12px; display: flex; align-items: center; justify-content: space-between; color: white; background: linear-gradient(120deg,#2563eb,#7059d9); border-radius: 9px; direction: rtl; }.ai-action span { display: flex; align-items: center; gap: 7px; font-size: 7px; }.ai-action small { color: rgba(255,255,255,.6); font-size: 6px; }
.flow-float-one { right: 245px; bottom: 82px; }.flow-float-two { left: -12px; top: 40px; }.flow-float-two > i { color: var(--violet); background: #eeeaff; }

.workflow-page .kicker { color: var(--violet); }
.workflow-page .benefit-icon { color: var(--violet); background: #eeeaff; }
.flow-dark-card { background: linear-gradient(145deg,#0b203d,#30266b); }
.flow-dark-card .benefit-icon { color: #c2b7ff; background: rgba(194,183,255,.1); }
.flow-dark-card > .flow-benefit-image { width: 100%; height: 190px; position: absolute; right: 0; left: 0; bottom: 0; z-index: 0; object-fit: cover; opacity: .34; mask-image: linear-gradient(to bottom,transparent,black 38%); }
.ai-capabilities { margin-top: 24px; padding-top: 18px; display: flex; flex-wrap: wrap; gap: 6px; position: relative; z-index: 2; border-top: 1px solid rgba(255,255,255,.1); }.ai-capabilities span { padding: 5px 8px; color: #d2cbff; background: rgba(124,99,238,.14); border: 1px solid rgba(194,183,255,.1); border-radius: 15px; font-size: 7px; }

.ai-engine { background: linear-gradient(125deg,#07172c,#1f2463); }
.ai-engine::before { background-image: linear-gradient(rgba(124,99,238,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(96,165,250,.09) 1px,transparent 1px); }
.ai-engine .kicker-light { color: #b9aeff; }
.ai-engine .algorithm-steps b { color: #b9aeff; background: rgba(124,99,238,.13); }
.ai-console { min-height: 530px; padding: 20px; position: relative; overflow: hidden; color: var(--ink); background: #f6f7fb; border: 1px solid rgba(255,255,255,.17); border-radius: 22px; box-shadow: 0 35px 80px rgba(0,0,0,.3); direction: ltr; }
.console-glow { width: 260px; height: 260px; position: absolute; right: -150px; top: -160px; background: var(--violet); border-radius: 50%; filter: blur(70px); opacity: .2; }
.ai-analysis-image { height: 155px; margin-bottom: 14px; position: relative; overflow: hidden; background: #111943; border-radius: 13px; }
.ai-analysis-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg,transparent 35%,rgba(7,23,44,.72)); }
.ai-analysis-image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.ai-analysis-image span { padding: 5px 9px; position: absolute; left: 11px; bottom: 10px; z-index: 2; color: white; background: rgba(7,23,44,.65); border: 1px solid rgba(185,174,255,.28); border-radius: 20px; font-size: 6px; font-weight: 800; letter-spacing: 1.1px; backdrop-filter: blur(8px); }.ai-analysis-image span i { margin-right: 5px; color: #b9aeff; }
.console-head { padding-bottom: 15px; display: flex; align-items: center; justify-content: space-between; position: relative; border-bottom: 1px solid var(--line); font-size: 8px; font-weight: 900; }.console-head span { display: flex; align-items: center; gap: 7px; }.console-head i { color: var(--violet); }.console-head em { color: #7360d2; font-size: 6px; font-style: normal; letter-spacing: 1.2px; }
.document-preview { height: 205px; margin: 16px 0 11px; padding: 25px 24px; position: relative; overflow: hidden; background: white; border: 1px solid var(--line); border-radius: 11px; box-shadow: 0 8px 25px rgba(20,40,80,.05); }
.document-preview::before { content: "نامه داخلی"; position: absolute; left: 20px; top: 14px; color: #a2abb7; font-size: 7px; }
.document-lines { margin-top: 20px; }.document-lines b { width: 90%; height: 5px; margin-bottom: 11px; display: block; background: #dfe5ec; border-radius: 5px; }.document-lines b:nth-child(2) { width: 72%; }.document-lines b:nth-child(3) { width: 84%; }.document-lines b:nth-child(4) { width: 61%; }.document-lines b:nth-child(5) { width: 92%; }.document-lines b:nth-child(6) { width: 45%; }
.entity { padding: 3px 7px; position: absolute; color: #5d4db6; background: #eeeaff; border: 1px solid #ded6ff; border-radius: 10px; font-size: 6px; font-weight: 800; }.entity-one { left: 17%; top: 45%; }.entity-two { right: 20%; top: 63%; }.entity-three { left: 29%; bottom: 16%; }
.ai-summary { padding: 12px 14px; color: white; background: linear-gradient(120deg,#342a74,#5f4bc2); border-radius: 10px; direction: rtl; }.ai-summary small { color: #c9c1f3; font-size: 6px; }.ai-summary p { margin-top: 3px; color: rgba(255,255,255,.78); font-size: 8px; line-height: 1.8; }
.console-actions { margin-top: 10px; display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; direction: rtl; }.console-actions > div { padding: 10px 8px; display: flex; align-items: center; gap: 7px; background: white; border: 1px solid var(--line); border-radius: 9px; }.console-actions > div > i { width: 25px; height: 25px; display: grid; place-items: center; color: var(--flow); background: var(--flow-soft); border-radius: 7px; font-size: 7px; }.console-actions span { display: flex; flex-direction: column; }.console-actions small { color: var(--muted); font-size: 6px; }.console-actions b { font-size: 7px; }

.workflow-page .feature-list > article > i { color: var(--violet); background: #eeeaff; }
.flow-results { background: linear-gradient(125deg,#0b203d,#342a74); }
.flow-results .quote-mark,.flow-results .result-stats strong { color: #b9aeff; }

@media (max-width: 980px) {
    .workflow-visual { width: min(620px,100%); margin: auto; }
    .ai-console { width: min(620px,100%); margin: auto; }
}

@media (max-width: 760px) {
    .workflow-visual { min-height: 500px; }
    .workflow-photo { width: 90%; height: 435px; }
    .ai-desk { right: 0; bottom: 0; }
    .flow-float-one { right: 230px; bottom: 75px; }.flow-float-two { left: 0; }
}

@media (max-width: 520px) {
    .workflow-page .hero h1 { font-size: 32px; letter-spacing: -1.4px; }
    .workflow-visual { min-height: 455px; }
    .workflow-photo { width: 100%; height: 390px; border-width: 5px; border-radius: 22px; transform: none; }.workflow-photo figcaption small { display: none; }
    .ai-desk { width: calc(100% - 24px); right: 12px; bottom: 0; padding: 12px; }
    .flow-float-one,.flow-float-two { display: none; }
    .mail-card { display: none; }.ai-results { grid-template-columns: 1fr 1fr; }.ai-results div:first-child { grid-column: 1/-1; }
    .ai-console { min-height: auto; padding: 14px; }
    .document-preview { height: 180px; }
    .console-actions { grid-template-columns: 1fr; }
}