
/* Jordanian Arabic Reader Series - offline site. Navy hero with star pattern, cream pages, terracotta accent (matches the handbook). */
@font-face{font-family:'Inter';src:url('fonts/Inter-Regular.otf');font-weight:400;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-SemiBold.otf');font-weight:600;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-Bold.otf');font-weight:700;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/Inter-ExtraBold.otf');font-weight:800;font-display:swap}
@font-face{font-family:'Amiri';src:url('fonts/Amiri-Regular.ttf');font-weight:400;font-display:swap}
@font-face{font-family:'Amiri';src:url('fonts/Amiri-Bold.ttf');font-weight:700;font-display:swap}
@font-face{font-family:'NotoAr';src:url('fonts/NotoSansArabic-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'NotoAr';src:url('fonts/NotoSansArabic-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
:root{--navy:#1F2A44;--navy2:#2A3858;--cream:#FFF8EC;--paper:#FFFFFF;--ink:#1F2A44;--mute:#5B6682;--line:#E8DFCF;--terra:#D1603D;--terrafg:#FFFFFF;--hl:#FFE9A8;--hlfg:#1F2A44;
--a1:#2A9D8F;--a2:#2F7DA8;--b1:#D1603D;--b2:#8A4FA0;--ui:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;--ar:'NotoAr','Amiri','Noto Naskh Arabic','Traditional Arabic','Times New Roman',serif;
--pat:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MCIgaGVpZ2h0PSI4MCIgdmlld0JveD0iMCAwIDgwIDgwIj48ZyBmaWxsPSJub25lIiBzdHJva2U9IiNmZmZmZmYiIHN0cm9rZS1vcGFjaXR5PSIwLjEiIHN0cm9rZS13aWR0aD0iMS4yIj48cG9seWdvbiBwb2ludHM9IjQwLDYgNDcsMjQgNjYsMTQgNTYsMzMgNzQsNDAgNTYsNDcgNjYsNjYgNDcsNTYgNDAsNzQgMzMsNTYgMTQsNjYgMjQsNDcgNiw0MCAyNCwzMyAxNCwxNCAzMywyNCIvPjxjaXJjbGUgY3g9IjQwIiBjeT0iNDAiIHI9IjkiLz48Y2lyY2xlIGN4PSIwIiBjeT0iMCIgcj0iOSIvPjxjaXJjbGUgY3g9IjgwIiBjeT0iMCIgcj0iOSIvPjxjaXJjbGUgY3g9IjAiIGN5PSI4MCIgcj0iOSIvPjxjaXJjbGUgY3g9IjgwIiBjeT0iODAiIHI9IjkiLz48L2c+PC9zdmc+");--patn:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MCIgaGVpZ2h0PSI4MCIgdmlld0JveD0iMCAwIDgwIDgwIj48ZyBmaWxsPSJub25lIiBzdHJva2U9IiMxRjJBNDQiIHN0cm9rZS1vcGFjaXR5PSIwLjA2IiBzdHJva2Utd2lkdGg9IjEuMiI+PHBvbHlnb24gcG9pbnRzPSI0MCw2IDQ3LDI0IDY2LDE0IDU2LDMzIDc0LDQwIDU2LDQ3IDY2LDY2IDQ3LDU2IDQwLDc0IDMzLDU2IDE0LDY2IDI0LDQ3IDYsNDAgMjQsMzMgMTQsMTQgMzMsMjQiLz48Y2lyY2xlIGN4PSI0MCIgY3k9IjQwIiByPSI5Ii8+PGNpcmNsZSBjeD0iMCIgY3k9IjAiIHI9IjkiLz48Y2lyY2xlIGN4PSI4MCIgY3k9IjAiIHI9IjkiLz48Y2lyY2xlIGN4PSIwIiBjeT0iODAiIHI9IjkiLz48Y2lyY2xlIGN4PSI4MCIgY3k9IjgwIiByPSI5Ii8+PC9nPjwvc3ZnPg==")}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--cream:#121A2E;--paper:#1B2540;--ink:#EDE8DC;--mute:#A5AEC6;--line:#2C3858;--hl:#5B4B1C;--hlfg:#FFF3C9;--terra:#E87752;--a1:#3FB8A8;--a2:#5AA2D0;--b1:#E87752;--b2:#B07CC4;--patn:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MCIgaGVpZ2h0PSI4MCIgdmlld0JveD0iMCAwIDgwIDgwIj48ZyBmaWxsPSJub25lIiBzdHJva2U9IiNmZmZmZmYiIHN0cm9rZS1vcGFjaXR5PSIwLjEiIHN0cm9rZS13aWR0aD0iMS4yIj48cG9seWdvbiBwb2ludHM9IjQwLDYgNDcsMjQgNjYsMTQgNTYsMzMgNzQsNDAgNTYsNDcgNjYsNjYgNDcsNTYgNDAsNzQgMzMsNTYgMTQsNjYgMjQsNDcgNiw0MCAyNCwzMyAxNCwxNCAzMywyNCIvPjxjaXJjbGUgY3g9IjQwIiBjeT0iNDAiIHI9IjkiLz48Y2lyY2xlIGN4PSIwIiBjeT0iMCIgcj0iOSIvPjxjaXJjbGUgY3g9IjgwIiBjeT0iMCIgcj0iOSIvPjxjaXJjbGUgY3g9IjAiIGN5PSI4MCIgcj0iOSIvPjxjaXJjbGUgY3g9IjgwIiBjeT0iODAiIHI9IjkiLz48L2c+PC9zdmc+");color-scheme:dark}}
:root[data-theme="dark"]{--cream:#121A2E;--paper:#1B2540;--ink:#EDE8DC;--mute:#A5AEC6;--line:#2C3858;--hl:#5B4B1C;--hlfg:#FFF3C9;--terra:#E87752;--a1:#3FB8A8;--a2:#5AA2D0;--b1:#E87752;--b2:#B07CC4;--patn:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4MCIgaGVpZ2h0PSI4MCIgdmlld0JveD0iMCAwIDgwIDgwIj48ZyBmaWxsPSJub25lIiBzdHJva2U9IiNmZmZmZmYiIHN0cm9rZS1vcGFjaXR5PSIwLjEiIHN0cm9rZS13aWR0aD0iMS4yIj48cG9seWdvbiBwb2ludHM9IjQwLDYgNDcsMjQgNjYsMTQgNTYsMzMgNzQsNDAgNTYsNDcgNjYsNjYgNDcsNTYgNDAsNzQgMzMsNTYgMTQsNjYgMjQsNDcgNiw0MCAyNCwzMyAxNCwxNCAzMywyNCIvPjxjaXJjbGUgY3g9IjQwIiBjeT0iNDAiIHI9IjkiLz48Y2lyY2xlIGN4PSIwIiBjeT0iMCIgcj0iOSIvPjxjaXJjbGUgY3g9IjgwIiBjeT0iMCIgcj0iOSIvPjxjaXJjbGUgY3g9IjAiIGN5PSI4MCIgcj0iOSIvPjxjaXJjbGUgY3g9IjgwIiBjeT0iODAiIHI9IjkiLz48L2c+PC9zdmc+");color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--ui);font-size:16px;line-height:1.55;-webkit-text-size-adjust:100%}
a{color:inherit}
.wrap{max-width:1080px;margin-inline:auto;padding-inline:20px}
.hero{background:var(--navy) var(--pat);color:#FFF8EC;padding-block:28px 40px}
.topnav{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;font-size:14px;font-weight:600;margin-bottom:28px}
.topnav a{text-decoration:none;opacity:.85}.topnav a:hover{opacity:1;text-decoration:underline}
.topnav .sp{margin-inline-start:auto}
.eyebrow{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#E9A889;font-weight:700}
.chip{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.08em;color:#fff;padding:3px 10px;border-radius:999px}
.chip.A1{background:var(--a1)}.chip.A2{background:var(--a2)}.chip.B1{background:var(--b1)}.chip.B2{background:var(--b2)}
h1,h2,h3{font-weight:800;letter-spacing:-.01em;line-height:1.15;text-wrap:balance;margin:0}
.ar{font-family:var(--ar);direction:rtl}
.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;font-size:15px;padding:11px 18px;border-radius:12px;border:2px solid transparent;cursor:pointer;font-family:inherit}
.btn.main{background:var(--terra);color:var(--terrafg)}
.btn.ghost{background:transparent;border-color:rgba(255,248,236,.35);color:#FFF8EC}
.btn:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #F4C9A8;outline-offset:2px}
.sec{padding-block:44px}
.sec h2{font-size:clamp(26px,4vw,36px)}
.lead{color:var(--mute);max-width:62ch;margin:10px 0 0}
.card{background:var(--paper);border:1px solid var(--line);border-radius:16px}
.foot{padding-block:36px;color:var(--mute);font-size:14px;border-top:1px solid var(--line)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

[hidden]{display:none!important}
