/* QuickQ - Pricing Page CSS (TI Style) */
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin: 48px 0; align-items: stretch; }
.plan-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 36px 28px; display: flex; flex-direction: column; position: relative; transition: all .3s; }
.plan-card:hover { border-color: var(--brand); transform: translateY(-4px); }
.plan-card.featured { border: 2px solid var(--brand); }
.plan-badge { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: var(--brand); color: #fff; font-size: 11px; font-weight: 700; padding: 4px 16px; border-radius: 100px; text-transform: uppercase; letter-spacing: 1px; }
.plan-name { font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.plan-desc { font-size: 13px; color: var(--text-mute); margin-bottom: 24px; line-height: 1.6; }
.plan-price { display: flex; align-items: baseline; gap: 4px; margin-bottom: 8px; }
.plan-price .currency { font-size: 18px; font-weight: 700; color: var(--text-mute); }
.plan-price .amount { font-size: 48px; font-weight: 700; line-height: 1; color: var(--text); }
.plan-price .period { font-size: 14px; color: var(--text-mute); }
.plan-original { font-size: 14px; color: var(--text-mute); text-decoration: line-through; margin-bottom: 24px; }
.plan-features { list-style: none; flex: 1; margin-bottom: 28px; }
.plan-features li { padding: 10px 0; font-size: 14px; color: var(--text-soft); display: flex; align-items: flex-start; gap: 10px; border-bottom: 1px solid var(--border); }
.plan-features li:last-child { border-bottom: none; }
.plan-features li::before { content: "✓"; color: var(--brand); font-weight: 700; flex-shrink: 0; }
.plan-card .btn { width: 100%; justify-content: center; }
.compare-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; margin: 48px 0; }
.compare-table th, .compare-table td { padding: 14px 20px; text-align: left; font-size: 14px; border-bottom: 1px solid var(--border); }
.compare-table th { background: var(--bg-card); font-weight: 700; font-size: 13px; }
.compare-table tr:last-child td { border-bottom: none; }
.compare-table .yes { color: #22c55e; font-weight: 700; }
.compare-table .no { color: var(--text-mute); }
@media (max-width: 1024px) { .pricing-grid { grid-template-columns: 1fr; } }