:root{font-family:system-ui,'Segoe UI',Tahoma,Arial,sans-serif;color:#173a31;background:#f5f8f6}*{box-sizing:border-box}body{margin:0}header{background:#14513e;color:white;display:flex;justify-content:space-between;align-items:center;padding:16px max(20px,calc((100vw - 1100px)/2));gap:16px}.brand{display:flex;align-items:center;gap:12px}.brand small{display:block;font-size:12px;opacity:.85}.logo{background:#fff;color:#14513e;font-weight:800;padding:13px;border-radius:12px}nav{display:flex;gap:8px}button{font:inherit;cursor:pointer;border:1px solid #b9d2c6;background:#fff;color:#124632;border-radius:10px;padding:10px 14px}button:hover,button:focus-visible{outline:2px solid #c28c31}nav button{border-color:#89ad9f}main{max-width:1100px;margin:auto;padding:20px}.hero{border-radius:16px;background:linear-gradient(125deg,#e2eee5,#fff);padding:30px;text-align:center}.hero h1{font-size:clamp(26px,4vw,42px);margin:10px}.hero .verse{font-size:28px;color:#125342}.notice{border:1px solid #d7af73;background:#fff8ea;border-radius:8px;padding:12px;font-size:13px}.gateway{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}.portal{font-weight:700;min-height:66px}.panel{padding:20px;background:white;border:1px solid #dce6df;border-radius:14px;margin:16px 0}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.card{display:block;width:100%;text-align:start;min-height:80px;border:1px solid #ceded3;background:#f9fcfa}.card b{display:block}.muted{color:#506b60}.back{margin-bottom:12px}footer{text-align:center;color:#597367;padding:24px;font-size:12px}html[dir=rtl] .card{text-align:right}@media(max-width:700px){.gateway{grid-template-columns:repeat(2,1fr)}header{padding:12px;flex-wrap:wrap}.hero{padding:18px}}

/* Tereem official visual identity — stage 1.10 */
.brand-logo{width:58px;height:58px;object-fit:contain;background:white;border-radius:12px;padding:3px}
.hero-logo{height:145px;max-width:70%;object-fit:contain;display:block;margin:0 auto 12px}
.branded-card{display:flex;align-items:center;gap:14px;min-height:92px;background:#fff;border:2px solid #cf9d45;color:#053b70;box-shadow:0 2px 6px #092e4d18;font-weight:700}
.card-logo{width:63px;height:63px;flex:0 0 63px;object-fit:contain;background:white;border-radius:10px}
.branded-card:hover{background:#eaf8f4;border-color:#009e91;transform:translateY(-1px)}
html[dir=rtl] .branded-card{text-align:right}
@media(max-width:600px){.hero-logo{height:110px}.card-logo{width:50px;height:50px;flex-basis:50px}}