@font-face { font-family: "Vazirmatn"; src: url("/fonts/vazirmatn-regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Vazirmatn"; src: url("/fonts/vazirmatn-bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }

:root { color: #112a22; background: #f7f3ea; font-family: Vazirmatn, Tahoma, Arial, sans-serif; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: #f7f3ea; }
button { font: inherit; }
.shell { width: min(1120px, calc(100% - 36px)); margin: 0 auto; }
.topbar { min-height: 94px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: #112a22; text-decoration: none; font-weight: 700; font-size: 18px; direction: ltr; }
.brand img { width: 34px; height: 34px; }
.language { display: flex; gap: 4px; border: 1px solid #e2ddd2; background: rgba(255,255,255,.6); border-radius: 999px; padding: 4px; }
.language-button { border: 0; background: transparent; color: #61736c; padding: 7px 10px; border-radius: 999px; cursor: pointer; font-size: 12px; }
.language-button.is-active { color: #fff; background: #173d30; }
.hero { display: grid; grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: stretch; padding: 56px 0 66px; border-bottom: 1px solid #ded8cc; }
.hero-copy { padding: 28px 0; }
.eyebrow { margin: 0 0 12px; color: #5d796d; font-size: 13px; font-weight: 700; letter-spacing: .02em; }
h1, h2, p { margin-top: 0; }
h1 { max-width: 680px; margin-bottom: 20px; font-size: clamp(38px, 5vw, 68px); line-height: 1.15; letter-spacing: -.04em; }
.hero-description { max-width: 620px; color: #50645b; font-size: 17px; line-height: 1.95; }
.trust-line { display: inline-flex; align-items: center; gap: 9px; margin-top: 18px; color: #2b5645; font-size: 13px; }
.status-dot { width: 9px; height: 9px; border-radius: 50%; background: #69ca96; box-shadow: 0 0 0 6px rgba(105,202,150,.13); }
.slider { position: relative; min-height: 315px; padding: 38px; border-radius: 28px; background: #153d2f; color: #f7f3ea; overflow: hidden; }
.slider::after { content: ""; position: absolute; width: 310px; height: 310px; left: -110px; bottom: -160px; border: 1px solid rgba(217,238,216,.16); border-radius: 50%; }
.slide { display: none; position: relative; z-index: 1; min-height: 205px; }
.slide.is-active { display: block; animation: fade .35s ease; }
@keyframes fade { from { opacity: .2; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.slide-kicker { margin-bottom: 15px; color: #a7d4bd; font-size: 13px; font-weight: 700; }
.slide h2 { max-width: 340px; font-size: 29px; line-height: 1.35; }
.slide p:last-child { max-width: 340px; color: #d4dfd9; line-height: 1.8; font-size: 14px; }
.slider-controls { position: absolute; z-index: 1; bottom: 28px; right: 38px; display: flex; gap: 8px; }
.slider-dot { width: 8px; height: 8px; border: 0; border-radius: 50%; background: rgba(255,255,255,.32); cursor: pointer; padding: 0; }
.slider-dot.is-active { width: 26px; border-radius: 99px; background: #a7d4bd; }
.rates { padding: 70px 0; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 22px; margin-bottom: 24px; }
.section-heading h2, .about h2 { margin-bottom: 0; font-size: clamp(27px, 3.4vw, 42px); line-height: 1.3; letter-spacing: -.03em; }
.updated-at { margin: 0; color: #75867d; font-size: 12px; text-align: left; direction: ltr; }
.rates-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border: 1px solid #e2ddd2; background: #fffdfa; border-radius: 22px; overflow: hidden; }
.rate { display: flex; gap: 15px; align-items: center; min-height: 138px; padding: 22px; border-bottom: 1px solid #eee8dd; }
.rate:nth-child(odd) { border-left: 1px solid #eee8dd; }
.rate:nth-last-child(-n+2) { border-bottom: 0; }
.rate-flag { width: 42px; height: 42px; object-fit: cover; border-radius: 50%; box-shadow: 0 5px 12px rgba(23,61,47,.12); }
.rate-content { min-width: 0; flex: 1; }
.rate-name { margin: 0 0 3px; font-size: 14px; font-weight: 700; }
.rate-symbol { color: #77857e; font-family: Arial, sans-serif; font-size: 11px; letter-spacing: .12em; }
.rate-value { margin: 0 0 4px; color: #173d30; font-family: Arial, sans-serif; font-size: clamp(21px, 2.5vw, 29px); font-weight: 700; direction: ltr; text-align: left; }
.rate-unit { color: #77857e; font-size: 11px; }
.rate-change { margin-right: auto; font-family: Arial, sans-serif; font-size: 12px; direction: ltr; }
.rate-change.positive { color: #247450; }.rate-change.negative { color: #bc4a55; }.rate-change.neutral { color: #77857e; }
.disclaimer { max-width: 770px; margin: 22px 0 0; color: #6f7d75; font-size: 13px; line-height: 1.9; }
.about { margin: 0 0 50px; padding: 54px; border-radius: 24px; background: #e7f0e7; }
.about h2 { max-width: 820px; margin-bottom: 18px; }.about p:last-child { max-width: 790px; margin-bottom: 0; color: #466257; line-height: 2; }
footer { display: flex; justify-content: space-between; gap: 18px; padding: 0 0 30px; color: #6f7d75; font-size: 12px; }
html[dir="ltr"] .shell { text-align: left; } html[dir="ltr"] .updated-at, html[dir="ltr"] .rate-value { text-align: right; } html[dir="ltr"] .rate:nth-child(odd) { border-left: 0; border-right: 1px solid #eee8dd; } html[dir="ltr"] .slider-controls { right: auto; left: 38px; }
@media (max-width: 760px) { .shell { width: min(100% - 28px, 600px); }.topbar { min-height: 76px; }.brand span { display: none; }.language-button { padding: 6px 8px; font-size: 11px; }.hero { grid-template-columns: 1fr; padding: 30px 0 46px; gap: 10px; } .hero-copy { padding: 12px 0; } h1 { font-size: 39px; }.hero-description { font-size: 15px; }.slider { min-height: 280px; padding: 28px; border-radius: 22px; }.slide h2 { font-size: 26px; }.slider-controls { bottom: 22px; right: 28px; }.rates { padding: 48px 0; }.section-heading { align-items: start; flex-direction: column; gap: 8px; }.updated-at { text-align: inherit; }.rates-grid { grid-template-columns: 1fr; }.rate { min-height: 110px; }.rate:nth-child(odd) { border-left: 0; }.rate:nth-last-child(2) { border-bottom: 1px solid #eee8dd; }.rate-value { font-size: 24px; }.about { margin-bottom: 34px; padding: 30px 24px; border-radius: 20px; }footer { flex-direction: column; }html[dir="ltr"] .rate:nth-child(odd) { border-right: 0; }}
