:root { color-scheme: light; font-family: Tajawal, Arial, sans-serif; color: #17202a; background: #f7f5f2; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 5% 0%, #f9ddd2 0, transparent 31rem), #f7f5f2; }
.page-shell { width: min(100% - 32px, 980px); margin: 0 auto; padding: 58px 0 72px; }
.hero { max-width: 610px; margin-bottom: 28px; }
.brand-mark { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 20px; border-radius: 14px; background: #72131b; color: white; font-size: 26px; font-weight: 800; }
.eyebrow { margin: 0 0 7px; color: #9f3c32; font-size: .88rem; font-weight: 800; letter-spacing: .03em; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 12px; font-size: clamp(2rem, 5vw, 3.4rem); line-height: 1.15; }
h2 { margin-bottom: 8px; font-size: 1.28rem; }
.intro, .muted, .description { color: #607080; line-height: 1.7; }
.lookup-card, .plan-card { background: white; border: 1px solid #e9e0dc; border-radius: 20px; box-shadow: 0 14px 35px rgba(61, 27, 22, .07); }
.lookup-card { padding: clamp(22px, 4vw, 34px); }
label { display: block; margin-bottom: 8px; font-size: .94rem; font-weight: 700; }
.input-row { display: flex; gap: 10px; }
input { min-width: 0; flex: 1; padding: 15px 16px; border: 1px solid #cfc4c0; border-radius: 12px; color: #17202a; font: inherit; direction: ltr; text-align: right; }
input:focus { outline: 3px solid #efd0c8; border-color: #9f3c32; }
button { border: 0; border-radius: 12px; padding: 0 22px; background: #72131b; color: white; font: inherit; font-weight: 800; cursor: pointer; }
button:hover { background: #561017; }
button:disabled { cursor: wait; opacity: .65; }
.message { min-height: 1.5em; margin: 15px 0 0; line-height: 1.5; }
.message.error { color: #b42318; }.message.success { color: #087443; }.message.loading { color: #556579; }
.app-downloads { margin-top: 22px; padding-top: 20px; border-top: 1px solid #eee5e1; }
.app-downloads h3 { margin-bottom: 6px; font-size: 1.08rem; }.app-downloads p { margin-bottom: 14px; color: #607080; line-height: 1.65; }
.store-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; direction: ltr; }
.store-badges a { display: inline-flex; align-items: center; min-height: 50px; }.store-badges img { display: block; width: auto; height: 50px; max-width: 100%; }
.plans-section, .installments-section { margin-top: 34px; }.plans-heading { margin-bottom: 16px; }.plans-heading h2 { font-size: 1.7rem; }.plans-heading .muted { margin-bottom: 0; }
.plans-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.plan-card { padding: 23px; border-top: 5px solid #a9382d; }.plan-card h3 { margin-bottom: 7px; font-size: 1.25rem; }.description { min-height: 2.7em; font-size: .93rem; }
.price-caption { margin: 19px 0 -15px; color: #607080; font-size: .88rem; font-weight: 700; }.price { margin: 20px 0; color: #72131b; font-size: 1.5rem; font-weight: 900; }.pricing-summary { margin: -4px 0 17px; padding: 12px 0; border-top: 1px solid #eee5e1; border-bottom: 1px solid #eee5e1; }.pricing-summary p { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 8px; color: #64717d; font-size: .93rem; }.pricing-summary p:last-child { margin-bottom: 0; }.pricing-summary .total-row { padding-top: 9px; border-top: 1px dashed #dcc9c4; color: #17202a; font-weight: 800; }.pricing-summary strong { color: #17202a; }.plan-details { border-top: 1px solid #eee5e1; padding-top: 13px; }.plan-details p { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 8px; color: #64717d; }.plan-details strong { color: #17202a; }.subscribe-button { width: 100%; min-height: 50px; margin-top: 13px; }.empty-state { padding: 22px; border-radius: 14px; background: #fff5f2; color: #7b3028; }
.payment-options { display: grid; gap: 9px; margin: 18px 0; padding: 0; border: 0; }.payment-options legend { margin-bottom: 8px; color: #344054; font-size: .92rem; font-weight: 800; }.payment-option { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid #e4d9d4; border-radius: 12px; cursor: pointer; transition: border-color .2s ease, background .2s ease; }.payment-option.selected { border-color: #9f3c32; background: #fff5f2; }.payment-option input { flex: 0 0 auto; width: 18px; min-height: 18px; margin: 2px 0 0; accent-color: #72131b; }.payment-option span { display: grid; gap: 3px; }.payment-option strong { color: #17202a; }.payment-option small { color: #607080; line-height: 1.45; }.installments-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }.installment-card { padding: 23px; border: 1px solid #d6e6df; border-top: 5px solid #087443; border-radius: 20px; background: #fff; box-shadow: 0 14px 35px rgba(61, 27, 22, .07); }.installment-card.overdue { border-color: #efc7c2; border-top-color: #b42318; }.installment-card h3 { margin-bottom: 6px; font-size: 1.13rem; }.installment-card .price { margin: 16px 0 9px; }.installment-note { margin: 15px 0 0; color: #607080; font-size: .92rem; }
.payment-single-note { margin: 0; color: #607080; font-size: .9rem; line-height: 1.5; }
@media (max-width: 580px) { .page-shell { width: min(100% - 24px, 980px); padding-top: 32px; }.input-row { flex-direction: column; } button { min-height: 52px; }.lookup-card { border-radius: 16px; }.store-badges { align-items: stretch; }.store-badges a { min-height: 48px; } }