@charset "UTF-8";
@font-face{font-family:"Effra";font-style:normal;font-weight:400 750;font-display:swap;src:url("../fonts/EffraVF_W_Wght.woff2") format("woff2-variations")}
@supports not (font-technology:"variations"){
  @font-face{font-family:"Effra";font-style:normal;font-display:swap;font-weight:400;src:url("../fonts/Effra_W_Rg.woff2") format("woff2")}
  @font-face{font-family:"Effra";font-style:normal;font-display:swap;font-weight:700;src:url("../fonts/Effra_W_Bd.woff2") format("woff2")}
}

:root{
--link:#2a5d84;--link-hover:#234b6a;--text:#222;--text-muted:#444;
--border:#e5e7eb;--border-hover:#cbd5e1;
--hero-from:#f6f8fa;--hero-to:#eef2f5;
--shadow-soft:0 2px 8px rgba(0,0,0,0.08);
--shadow-card:0 6px 16px rgba(0,0,0,0.12);
--transition:all .15s ease;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff;font-optical-sizing:auto;font-kerning:normal;text-rendering:optimizeLegibility}
html{color:var(--text);line-height:1.6;font-size:110%;font-weight:400}
body{color:var(--text);line-height:1.6;font-size:110%;font-weight:400;font-variant-numeric:tabular-nums}
img{max-width:100%;height:auto;display:block}

:is(html:lang(af),html:lang(en),html:lang(fr),html:lang(nl),html:lang(pt),html:lang(ru)){font-family:"Effra",system-ui,-apple-system,"BlinkMacSystemFont","Segoe UI","Roboto","Helvetica Neue","Liberation Sans","Noto Sans",Arial,sans-serif}
:is(html:lang(fa),html:lang(ar),html:lang(ku-Arab),html:lang(ur)){direction:rtl;text-align:right;font-family:"Effra","Noto Sans Arabic",system-ui,"Tahoma",sans-serif}

.visually-hidden-focusable{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.visually-hidden-focusable:focus{position:static;width:auto;height:auto;padding:.5rem 1rem;margin:.5rem;background:#111827;color:#fff;z-index:1000}

.header{text-align:center;padding:1.25rem 0 1.5rem}
.header h1{margin:.1em 0 .2em;font-weight:750}
.header h2{margin:0;font-weight:600}

h1,h2,.lang-card h3{text-align:center;margin:.5em 0;font-optical-sizing:auto}
h1{font-weight:750}h2{font-weight:650}.lang-card h3{font-weight:550}
p{margin:.75em 0;font-weight:400}

.container{margin-inline:auto;padding:0 1rem;max-width:72rem}

a:not(.cta):not(.lang-card){color:var(--link);text-decoration:underline;text-underline-offset:3px;transition:var(--transition);font-weight:500}
a:not(.cta):not(.lang-card):hover{color:var(--link-hover);text-decoration-thickness:2px}

.hero{position:relative;padding:1.75rem 1rem 2rem;text-align:center;margin:0 0 1rem;border-radius:10px;background:linear-gradient(135deg,rgba(0,0,0,.05),rgba(0,0,0,0)),linear-gradient(to right,var(--hero-from),var(--hero-to));box-shadow:var(--shadow-soft)}
.hero-content{max-width:42rem;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:1rem}
.hero-logo{display:flex;align-items:center;justify-content:center}
.hero-logo img{width:220px;max-width:80%}
.hero-text{max-width:34rem;margin:0 auto}
.hero-text h2{margin:.25rem 0 .4rem}
.hero-text p{margin:0 0 .9rem}
@media (max-width:480px){
.hero-text{max-width:none}
}
.cta-row{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem}
.cta{display:inline-block;padding:.65rem 1rem;border-radius:6px;text-decoration:none;cursor:pointer;transition:var(--transition);font-weight:500}
.cta-primary{background:#2563eb;color:#fff}
.cta-primary:hover,.cta-primary:focus{background:#1d4ed8;transform:translateY(-2px);box-shadow:var(--shadow-card)}
.cta-primary:focus{outline:3px solid #93c5fd;outline-offset:2px}

.lang-grid{display:grid;gap:14px;margin:12px 0;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.lang-card{display:block;padding:12px 12px 14px;border-radius:12px;background:#fff;color:inherit;border:2px solid var(--border);text-decoration:none;transition:transform .08s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease;box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 2px 8px rgba(0,0,0,.06)}
.lang-card h3{margin:.2rem 0 .4rem;font-size:1.1rem;line-height:1.3}
.lang-card p{margin:0;color:var(--text-muted);font-size:.95rem;line-height:1.5}
.pill{display:inline-flex;align-items:center;gap:.35rem;
  min-width:3rem;justify-content:center;
  font:600 .95rem "Effra",Arial,sans-serif;padding:.18rem .6rem;
  border-radius:999px;background:#f3f4f6;border:1px solid var(--border);
  margin-right:.35rem;font-variant-numeric:tabular-nums}
.lang-card:hover,.lang-card:focus{transform:translateY(-2px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 6px 14px rgba(0,0,0,.12);border-color:var(--border-hover)}

footer{text-align:center;padding:1rem 0;color:#333;border-top:1px solid #eee;margin-top:2rem;font-size:.95rem}
footer a{text-decoration:underline;text-underline-offset:3px}
footer a:hover{text-decoration-thickness:2px}

@media (max-width:768px){
.hero{padding:1.4rem 1rem 1.8rem}
.hero-logo img{width:190px}
}
@media (min-width:768px){.hero{margin:0 0 1.25rem}}
@media (min-width:1200px){.hero{margin:0 0 1.5rem}}

@media (prefers-color-scheme:dark){
html{color-scheme:dark light}
:root{
--link:#8ab4f8;--link-hover:#a7c5fa;
--text:#eaeaea;--text-muted:#cfcfcf;
--border:#3a3a3a;--border-hover:#555;
--hero-from:#0f172a;--hero-to:#111827;
}
html,body{background:#0b0f1a}
.hero{box-shadow:none}
.lang-card{background:#111827;border-color:var(--border)}
footer{color:#ccc;border-top-color:#333}
}

@media print{
body{font-weight:400;font-variant-numeric:tabular-nums}
h1{font-weight:700}h2{font-weight:600}h3{font-weight:500}
}
