/* Self-hosted open fonts; original SIL OFL notices live beside the font files. */
@font-face{font-family:'Alfa3 Tajawal';src:url('../fonts/tajawal/Tajawal-Regular.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Alfa3 Tajawal';src:url('../fonts/tajawal/Tajawal-Medium.woff') format('woff');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Alfa3 Tajawal';src:url('../fonts/tajawal/Tajawal-Bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Alfa3 Tajawal';src:url('../fonts/tajawal/Tajawal-ExtraBold.woff') format('woff');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Alfa3 Cairo';src:url('../fonts/cairo/Cairo.woff') format('woff');font-weight:200 1000;font-style:normal;font-display:swap}
@font-face{font-family:'Alfa3 IBM Plex Arabic';src:url('../fonts/ibmplexsansarabic/IBMPlexSansArabic-Regular.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Alfa3 IBM Plex Arabic';src:url('../fonts/ibmplexsansarabic/IBMPlexSansArabic-Medium.woff') format('woff');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Alfa3 IBM Plex Arabic';src:url('../fonts/ibmplexsansarabic/IBMPlexSansArabic-Bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}
html[data-alfa3-font]{--a3-font:'Alfa3 Tajawal',Tahoma,Arial,sans-serif}
html[data-alfa3-font="cairo"]{--a3-font:'Alfa3 Cairo','Alfa3 Tajawal',Tahoma,Arial,sans-serif}
html[data-alfa3-font="ibm_plex_arabic"]{--a3-font:'Alfa3 IBM Plex Arabic','Alfa3 Tajawal',Tahoma,Arial,sans-serif}
/* Preserve icon faces and code editors while overriding legacy text/inline font choices. */
html[data-alfa3-font] body,html[data-alfa3-font] body *:not(i):not(svg):not(path):not(code):not(pre):not(.fa):not(.fas):not(.far):not(.fal):not(.fab):not(.fad):not(.bi):not([class*="fa-"]):not([class*="bi-"]):not([class^="icon-"]):not([class*=" icon-"]):not([class*="note-icon"]):not([class*="material-icons"]):not([class*="material-symbols"]):not(.CodeMirror):not(.CodeMirror *){font-family:var(--a3-font)!important}
html[data-alfa3-font] h1,html[data-alfa3-font] h2,html[data-alfa3-font] h3,html[data-alfa3-font] h4,html[data-alfa3-font] h5,html[data-alfa3-font] h6{font-weight:700;letter-spacing:0}
/* Homepage hero was 100vh. Its absolute carousel layers inherit this exact half-height. */
html[data-alfa3-font] #hero{height:50vh;min-height:0;margin-top:144px}
html[data-alfa3-font] #hero .carousel-item>.container{padding-top:14px;padding-bottom:14px;margin-bottom:24px;max-height:calc(100% - 24px);overflow:auto}
html[data-alfa3-font] #hero h2{font-size:clamp(1.35rem,3vw,2.35rem);line-height:1.5;margin-bottom:10px}
html[data-alfa3-font] #hero p{margin-bottom:12px}
html[data-alfa3-font] #hero p:empty{display:none}
@media(max-width:575.98px){html[data-alfa3-font] #hero .carousel-item>.container{width:calc(100% - 36px);padding:10px 14px;margin-bottom:24px}html[data-alfa3-font] #hero .btn-get-started{padding:9px 18px}}

@media(max-width:991.98px){html[data-alfa3-font] #hero{margin-top:114px}}
/* Translucent hero caption: keep text fully opaque and expose more of the image. */
html[data-alfa3-font] #hero .carousel-item>.container{background:rgba(255,255,255,.70);border:1px solid rgba(255,255,255,.65);box-shadow:0 10px 32px rgba(8,30,49,.16);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
html[data-alfa3-font] #hero .btn-get-started{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 28px;border:1px solid #c9a261;border-radius:12px;background:linear-gradient(135deg,#173b59,#0e2942);color:#fff;font-size:17px;font-weight:700;letter-spacing:0;line-height:1.4;box-shadow:0 5px 14px rgba(9,35,57,.22);transition:background .2s ease,box-shadow .2s ease,transform .2s ease}
html[data-alfa3-font] #hero .btn-get-started::after{content:'←';font-size:22px;line-height:1;color:#f0ce92}
html[data-alfa3-font][dir="ltr"] #hero .btn-get-started::after{content:'→'}
html[data-alfa3-font] #hero .btn-get-started:hover{background:linear-gradient(135deg,#23577a,#173b59);color:#fff;transform:translateY(-2px);box-shadow:0 8px 20px rgba(9,35,57,.28)}
html[data-alfa3-font] #hero .btn-get-started:focus-visible{outline:3px solid #c9a261;outline-offset:4px}
html[data-alfa3-font][data-alfa3-mode="dark"] #hero .carousel-item>.container{background:rgba(25,38,56,.76);border-color:rgba(175,199,220,.35)}
@media(prefers-color-scheme:dark){html[data-alfa3-font][data-alfa3-mode="auto"] #hero .carousel-item>.container{background:rgba(25,38,56,.76);border-color:rgba(175,199,220,.35)}}
@media(prefers-reduced-motion:reduce){html[data-alfa3-font] #hero .btn-get-started{transition:none;transform:none}}