/* CallReady — product styles layered on top of nl.css (shared GagarinSoft design system) */

code { background: rgba(139,92,246,.13); color: #a78bfa; padding: 2px 7px; border-radius: 5px; font-size: .88em; font-family: 'Cascadia Code', 'Fira Code', monospace; }
kbd { background: #27272a; border: 1px solid #3f3f46; color: #e4e4e7; padding: 2px 8px; border-radius: 5px; font-size: .82em; font-family: 'Space Grotesk', sans-serif; }
.nav-link { font-size: 13px; color: #71717a; text-decoration: none; padding: 8px 4px; transition: color .2s; }
.nav-link:hover { color: #fafafa; }
.text-strong { color: #e4e4e7; }

/* Hero readiness ticker */
.ready-demo { background: #18181b; border: 1px solid #27272a; border-radius: 14px; padding: 24px 28px; max-width: 560px; margin: 44px auto 0; text-align: left; }
.ready-demo .rd-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 11px; color: #52525b; text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 16px; }
.ready-demo .rd-head strong { color: #a78bfa; font-weight: 700; }
.rd-row { display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid #27272a; }
.rd-row:last-of-type { border-bottom: none; }
.rd-row i { color: #71717a; font-size: 13px; }
.rd-name { font-size: 14px; color: #e4e4e7; }
.rd-name span { display: block; font-size: 12px; color: #71717a; }
.rd-state { font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: #22c55e; }
.rd-state.warn { color: #f59e0b; }
.rd-verdict { margin-top: 16px; padding-top: 16px; border-top: 1px solid #27272a; font-size: 13px; color: #a1a1aa; }
.rd-verdict strong { color: #22c55e; letter-spacing: 1.2px; }

/* Verdict cards */
.verdict-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media(max-width:820px){ .verdict-grid { grid-template-columns: 1fr; } }
.verdict-card { background: #18181b; border: 1px solid #27272a; border-radius: 12px; padding: 26px 24px; }
.verdict-card .v-dot { width: 10px; height: 10px; border-radius: 50%; background: currentColor; box-shadow: 0 0 14px currentColor; }
.verdict-card .v-name { display: block; font-size: 16px; font-weight: 700; letter-spacing: 1.2px; margin: 16px 0 8px; }
.verdict-card p { color: #a1a1aa; font-size: 13px; line-height: 1.7; }
.verdict-card.is-ready { color: #22c55e; }
.verdict-card.is-attention { color: #f59e0b; }
.verdict-card.is-not-ready { color: #ef4444; }

/* Check steps */
.step-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
@media(max-width:1000px){ .step-grid { grid-template-columns: repeat(3,1fr); } }
@media(max-width:640px){ .step-grid { grid-template-columns: 1fr; } }
.step-card { background: #1f1f23; border: 1px solid #27272a; border-radius: 12px; padding: 26px 22px; }
.step-card .step-n { font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: #8b5cf6; margin-bottom: 12px; }
.step-card i { font-size: 24px; color: #a78bfa; margin-bottom: 12px; display: block; }
.step-card h4 { font-size: 15px; font-weight: 600; margin-bottom: 8px; }
.step-card p { color: #71717a; font-size: 13px; line-height: 1.65; }

/* Platform strip */
.apps-strip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
@media(max-width:900px){ .apps-strip { grid-template-columns: repeat(3,1fr); } }
@media(max-width:560px){ .apps-strip { grid-template-columns: repeat(2,1fr); } }
.apps-cat { background: #18181b; border: 1px solid #27272a; border-radius: 12px; padding: 20px; text-align: center; }
.apps-cat i { font-size: 20px; color: #a78bfa; margin-bottom: 10px; display: block; }
.apps-cat h4 { font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.apps-cat p { font-size: 12px; color: #71717a; line-height: 1.6; }
.apps-note-line { margin: 28px auto 0; max-width: 720px; text-align: center; color: #71717a; font-size: 14px; line-height: 1.75; }

/* Comparison table */
.compare-table { width: 100%; border-collapse: collapse; background: #18181b; border: 1px solid #27272a; border-radius: 12px; overflow: hidden; }
.compare-table th { text-align: left; padding: 14px 18px; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #52525b; background: #1f1f23; border-bottom: 1px solid #27272a; }
.compare-table td { padding: 14px 18px; font-size: 14px; color: #a1a1aa; border-bottom: 1px solid #27272a; }
.compare-table tr:last-child td { border-bottom: none; }
.compare-table td:first-child { color: #fafafa; font-weight: 600; }
.compare-table .yes { color: #22c55e; }
.compare-table .no { color: #71717a; }
.compare-table .yay { color: #a78bfa; font-weight: 600; }
.table-scroll { overflow-x: auto; }

/* Personas */
.persona-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media(max-width:768px){ .persona-grid { grid-template-columns: 1fr; } }
.persona-card { background: #18181b; border: 1px solid #27272a; border-radius: 12px; padding: 24px; }
.persona-card .persona-role { font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #8b5cf6; margin-bottom: 10px; }
.persona-card p { color: #a1a1aa; font-size: 14px; line-height: 1.7; }

/* Pricing */
.price-card { background: #18181b; border: 1px solid #27272a; border-radius: 20px; padding: 48px; max-width: 460px; margin: 0 auto; text-align: center; }
.price-card .price-tag { font-size: 48px; font-weight: 700; letter-spacing: -2px; color: #fafafa; }
.price-card .price-tag span { margin-left: 4px; font-size: 16px; color: #71717a; font-weight: 500; letter-spacing: 0; }
.price-card .price-includes { list-style: none; text-align: left; margin: 24px 0; }
.price-card .price-includes li { color: #a1a1aa; font-size: 14px; padding: 8px 0; display: flex; gap: 10px; align-items: flex-start; }
.price-card .price-includes li::before { content: '✓'; color: #22c55e; flex-shrink: 0; }
.price-card .trial-badge { display: inline-block; background: rgba(139,92,246,.13); color: #a78bfa; font-size: 12px; font-weight: 700; padding: 5px 14px; border-radius: 999px; margin-bottom: 20px; }
.price-note { color: #52525b; font-size: 12px; margin-top: 16px; }

/* Privacy */
.privacy-box { background: #18181b; border: 1px solid rgba(34,197,94,.2); border-radius: 16px; padding: 40px; }
.privacy-box .privacy-title { font-size: 22px; font-weight: 700; letter-spacing: -.5px; margin-bottom: 20px; display: flex; align-items: center; gap: 12px; }
.privacy-box .privacy-title i { color: #22c55e; }
.privacy-list { list-style: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media(max-width:768px){ .privacy-list { grid-template-columns: 1fr; } }
.privacy-list li { color: #a1a1aa; font-size: 14px; display: flex; gap: 10px; align-items: flex-start; }
.privacy-list li i { color: #22c55e; flex-shrink: 0; margin-top: 3px; }

@media(max-width:640px) {
  .hero h1 { font-size: 32px; letter-spacing: -1px; }
  .price-card { padding: 32px 24px; }
  .privacy-box { padding: 28px 22px; }
}

/* In-article download CTA. .cta-btn (not .btn-primary) is used inside
   .article-content because it carries the !important colour and underline
   overrides that beat the generic `.article-content a` rule. */
.store-badge-container { margin: 28px 0 8px; }

/* Right-to-left support (Arabic) */
[dir="rtl"] .price-card .price-includes,
[dir="rtl"] .compare-table th,
[dir="rtl"] .compare-table td { text-align: right; }
[dir="rtl"] .language-dropdown { right: auto; left: 0; }
[dir="rtl"] .language-dropdown::before { right: auto; left: 18px; }
[dir="rtl"] .nav-back .fa-arrow-left { transform: scaleX(-1); }
[dir="rtl"] .breadcrumb i,
[dir="rtl"] .page-header .breadcrumb i { transform: scaleX(-1); }
[dir="rtl"] .doc-section ul li::before,
[dir="rtl"] .doc-section ol li::before { left: auto; right: 8px; }
[dir="rtl"] .doc-section li { padding: 8px 28px 8px 0; }
[dir="rtl"] .article-content ul,
[dir="rtl"] .article-content ol { padding-left: 0; padding-right: 22px; }