:root{--currency-green:#173f35;--currency-terracotta:#b85f36;--currency-cream:#fff9f1;--currency-ink:#26342f}
body[data-page="jordanian-currency"]{background:var(--currency-cream);color:var(--currency-ink)}
body[data-page="jordanian-currency"] main{margin:0 auto;max-width:1240px;padding:0 24px 76px}
.currency-hero{align-items:center;background:linear-gradient(135deg,#173f35,#285b4d);border-radius:0 0 34px 34px;color:#fff;display:grid;gap:38px;grid-template-columns:.88fr 1.12fr;margin:0 -24px 56px;padding:58px clamp(28px,5vw,70px)}
.currency-hero h1{color:#fff;font-family:Georgia,serif;font-size:clamp(2.55rem,5.5vw,4.8rem);letter-spacing:-.045em;line-height:1;margin:10px 0 18px}.currency-hero-copy>p:not(.eyebrow){color:#edf4f1;font-size:1.06rem;line-height:1.7;max-width:560px}.currency-hero .eyebrow{color:#f2bf8f}.currency-hero figure{background:#fff;border-radius:22px;box-shadow:0 24px 60px rgba(8,29,24,.28);margin:0;overflow:hidden}.currency-hero img{display:block;height:auto;width:100%}.currency-hero figcaption{background:#fff;color:#65716b;font-size:.72rem;padding:9px 14px}.official-currency{border-left:3px solid #df8b54;color:#fff;display:block;font-family:Georgia,serif;font-size:1.08rem;line-height:1.5;margin-top:24px;max-width:550px;padding:3px 0 3px 16px}
.currency-section{margin:0 auto 66px;max-width:1100px}.currency-heading{margin-bottom:24px;max-width:680px}.currency-heading h2,.currency-practical h2{color:var(--currency-green);font-family:Georgia,serif;font-size:clamp(2rem,4vw,3.1rem);margin:6px 0 12px}.currency-heading p:last-child,.currency-practical>div>p{color:#65716b;line-height:1.65}.banknote-grid,.coin-grid{display:grid;gap:15px}.banknote-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.coin-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.money-card{background:#fff;border:1px solid #eadfd2;border-radius:18px;box-shadow:0 12px 30px rgba(50,40,31,.08);min-width:0;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease}.money-card:hover{box-shadow:0 18px 38px rgba(50,40,31,.13);transform:translateY(-3px)}
.currency-converter-section{margin:58px auto 0;max-width:820px}.currency-converter-section .currency-heading{margin:0 auto 16px;text-align:center}.currency-converter-section .currency-heading h2{font-size:clamp(1.55rem,3vw,2.15rem);margin:4px 0 7px}.currency-converter-section .currency-heading p:last-child{font-size:.9rem}.converter-card{background:#fff;border:1px solid #eadfd2;border-radius:20px;box-shadow:0 12px 30px rgba(50,40,31,.08);padding:20px}.converter-controls{align-items:end;display:grid;gap:10px;grid-template-columns:minmax(100px,.55fr) minmax(185px,1fr) 42px minmax(185px,1fr)}.converter-controls label{display:grid;gap:6px;min-width:0}.converter-controls label>span{color:#52615a;font-size:.68rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.converter-controls input,.converter-controls select{appearance:auto;background:#fffaf4;border:1px solid #dfd1c2;border-radius:11px;color:#173f35;font:inherit;font-size:.88rem;font-weight:750;height:44px;min-width:0;padding:0 11px;width:100%}.converter-controls input{font-family:Georgia,serif;font-size:1.08rem}.converter-controls input:focus,.converter-controls select:focus,.converter-swap:focus-visible{border-color:#b85f36;box-shadow:0 0 0 3px rgba(184,95,54,.14);outline:0}.converter-swap{align-items:center;background:#173f35;border:0;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:1.2rem;height:40px;justify-content:center;margin:0 auto 2px;width:40px}.converter-swap:hover{background:#b85f36}.converter-swap.is-swapping{animation:converter-swap .3s ease}.converter-output{background:#f7eee3;border-left:3px solid #b85f36;border-radius:0 13px 13px 0;margin-top:14px;min-height:88px;padding:13px 16px}.converter-output p{margin:0}.converter-source{color:#52615a;font-size:.78rem;font-weight:800}.converter-result{color:#173f35;font-family:Georgia,serif;font-size:clamp(1.35rem,3vw,1.85rem);font-weight:700;line-height:1.15;margin-top:3px!important}.converter-result span{color:#8b563f;font-family:inherit;font-size:.55em;font-weight:500}.converter-unit{color:#52615a;font-size:.76rem;font-weight:750;margin-top:6px!important}.converter-updated{color:#6d7772;font-size:.68rem;margin-top:7px!important}.converter-status{align-items:center;color:#52615a;display:flex;font-size:.85rem;font-weight:750;min-height:58px}.converter-error{color:#8f3d2d}.converter-disclaimer{color:#65716b;font-size:.7rem;line-height:1.5;margin:11px 2px 0}.converter-attribution{color:#8b563f;font-size:.68rem;font-weight:750;text-underline-offset:2px}@keyframes converter-swap{50%{transform:rotate(180deg)}}
.money-visual{background-color:#efe6dc;background-position:var(--bg-x) var(--bg-y);background-repeat:no-repeat;background-size:var(--bg-size) auto;width:100%}.banknote-visual{aspect-ratio:1.92/1;background-image:url("../images/currency/jordanian-banknotes-guide.jpeg")}.coin-visual{aspect-ratio:2/1;background-image:url("../images/currency/jordanian-coins-guide.jpeg")}.money-label{display:flex;flex-direction:column;gap:3px;padding:15px 16px 17px}.money-label strong{color:var(--currency-green);font-family:Georgia,serif;font-size:1.28rem;line-height:1.1}.money-label span{color:#8b563f;font-size:.84rem;font-weight:800;line-height:1.3}.currency-coins{background:#f4e8d9;border-radius:30px;padding:clamp(24px,5vw,50px)}.currency-coins .money-visual{background-color:#eee5dc}.currency-practical{display:grid;gap:20px;grid-template-columns:1.1fr .9fr;margin:0 auto;max-width:1100px}.currency-practical>div{background:#fff;border:1px solid #eadfd2;border-radius:24px;padding:clamp(22px,4vw,36px)}.currency-practical li{line-height:1.55;margin:10px 0;padding-left:3px}.price-examples{display:grid;gap:9px;margin-top:20px}.price-examples span{align-items:center;background:#f8f1e8;border-radius:13px;display:flex;gap:14px;justify-content:space-between;padding:13px 15px}.price-examples b{color:var(--currency-terracotta)}.price-examples small{color:#5e6a64;font-size:.84rem;font-weight:750;text-align:right}
@media(max-width:900px){.currency-hero{grid-template-columns:1fr}.banknote-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.coin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.converter-controls{grid-template-columns:1fr 1fr}.converter-amount{grid-column:1/-1}.converter-swap{grid-column:1/-1;grid-row:2;margin:0 auto;transform:rotate(90deg)}.converter-controls label:nth-of-type(2){grid-column:1;grid-row:3}.converter-controls label:nth-of-type(3){grid-column:2;grid-row:3}.converter-swap.is-swapping{animation:converter-swap-mobile .3s ease}}
@media(max-width:600px){body[data-page="jordanian-currency"] main{padding:0 14px 54px}.currency-hero{gap:24px;margin:0 -14px 42px;padding:40px 18px 24px}.currency-hero h1{font-size:clamp(2.3rem,12vw,3.45rem)}.currency-hero figure{border-radius:16px}.currency-section{margin-bottom:46px}.currency-heading{margin-bottom:18px}.banknote-grid{gap:11px;grid-template-columns:repeat(2,minmax(0,1fr))}.coin-grid{gap:11px}.money-card{border-radius:14px}.money-label{padding:12px 12px 14px}.money-label strong{font-size:1.16rem}.money-label span{font-size:.79rem}.currency-coins{border-radius:22px;padding:22px 14px}.currency-practical{grid-template-columns:1fr}.currency-practical>div{padding:21px}.official-currency{font-size:1rem}.currency-converter-section{margin:42px auto 0}.converter-card{border-radius:16px;padding:15px 12px}.converter-controls{grid-template-columns:1fr;gap:8px}.converter-amount,.converter-controls label:nth-of-type(2),.converter-controls label:nth-of-type(3),.converter-swap{grid-column:1;grid-row:auto}.converter-swap{height:38px;margin:0 auto;transform:rotate(90deg);width:38px}.converter-output{margin-top:11px;padding:12px 13px}.converter-controls input,.converter-controls select{height:44px}.converter-disclaimer{font-size:.68rem}}
@media(max-width:340px){.banknote-grid,.coin-grid{grid-template-columns:1fr 1fr}.money-label{padding-inline:10px}.currency-hero{padding-inline:14px}}
@media(max-width:360px){.coin-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.money-card{transition:none}}
@keyframes converter-swap-mobile{50%{transform:rotate(270deg)}}
@media(prefers-reduced-motion:reduce){.converter-swap.is-swapping{animation:none}}
