/* /pricing page. Loads after styles.css and only uses its tokens (with fallbacks). */
.pricing-page { --pr-accent: var(--orange, #c44d0e); --pr-card: var(--white, #fff); --pr-soft: var(--gray, #f2f2f2); --pr-line: var(--line, #e2e2e2); --pr-ink: var(--ink, #042a21); --pr-muted: var(--muted, #445f59); --pr-head: var(--display, var(--serif, Georgia, serif)); }

.pr-hero { padding: 72px 0 32px; }
.pr-hero h1 { font-family: var(--pr-head); }
.pr-intro { color: var(--pr-muted); font-size: 1.1rem; max-width: 640px; margin-inline: auto; }

.pr-plans { padding: 24px 0 72px; }
.pr-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: start; }
.pr-card { position: relative; background: var(--pr-card); border: 1px solid var(--pr-line); border-radius: 16px; padding: 36px 32px 32px; display: flex; flex-direction: column; }
.pr-card h2 { font-family: var(--pr-head); font-size: clamp(1.8rem, 2.4vw, 2.2rem); margin: 0 0 .2em; }
.pr-line { color: var(--pr-muted); min-height: 3.1em; margin-bottom: 18px; }
.pr-price { font-family: var(--pr-head); font-size: clamp(2.6rem, 4.2vw, 3.4rem); line-height: 1; margin: 0; }
.pr-price span { font-size: .55em; vertical-align: .55em; margin-inline: .04em; }
.pr-unit { color: var(--pr-muted); font-size: .95rem; margin: 8px 0 22px; min-height: 1.5em; }
.pr-card .cta-box { margin-bottom: 24px; }
.pr-card .btn { padding-inline: 16px; letter-spacing: .05em; }
.pr-renew { margin: -12px 0 18px; }
.pr-card .form-msg { font-size: .92rem; margin: 8px 0 0; }
.pr-head { font-weight: 600; margin: 0 0 10px; }
.pr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pr-list li { position: relative; padding-inline-start: 28px; font-size: .98rem; line-height: 1.45; }
.pr-list li::before { content: ""; position: absolute; inset-inline-start: 0; top: .2em; width: 18px; height: 18px; border-radius: 50%; background: var(--pr-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat; }
.pr-fine { color: var(--pr-muted); font-size: .9rem; margin: 20px 0 0; }

.pr-popular { border: 2px solid var(--pr-accent); box-shadow: 0 24px 60px -36px rgba(4, 42, 33, .45); }
.pr-badge { position: absolute; top: -14px; inset-inline-start: 50%; transform: translateX(-50%); background: var(--pr-accent); color: #fff; font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; padding: 6px 14px; border-radius: 10000px; margin: 0; white-space: nowrap; }
[dir="rtl"] .pr-badge { transform: translateX(50%); letter-spacing: 0; }

.pr-extras { background: var(--pr-soft); padding: 64px 0; }
.pr-extras h2, .pr-faq h2 { font-family: var(--pr-head); }
.pr-copies { list-style: none; margin: 24px 0 0; padding: 0; display: grid; gap: 12px; }
.pr-copies li { display: grid; grid-template-columns: 110px 1fr; gap: 16px; align-items: center; background: var(--pr-card); border-radius: 12px; padding: 16px 20px; }
.pr-copy-price { font-family: var(--pr-head); font-size: 1.6rem; }
.pr-copy-price span { font-size: inherit; }

.pr-faq { padding: 72px 0 88px; }
.pr-faq .faq { margin-top: 28px; }

@media (max-width: 1080px) {
  .pr-grid { grid-template-columns: 1fr; gap: 32px; max-width: 520px; margin-inline: auto; }
  .pr-line { min-height: 0; }
  .pr-hero { padding-top: 48px; }
}
@media (max-width: 480px) {
  .pr-card { padding: 30px 22px 26px; }
  .pr-copies li { grid-template-columns: 1fr; gap: 4px; }
}