/* Language gateway — independent of the radio article styles. */
:root{color-scheme:light;--navy:#102d40;--gold:#e5a52e;--cream:#fffaf1}
*{box-sizing:border-box}html{font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif}body{margin:0;background:#f8f3e9;color:var(--navy)}a{color:inherit}
.gateway{position:relative;isolation:isolate;min-height:810px;padding:0 clamp(18px,5vw,90px) 0;background:#332519 url('library-background-v461.webp') center center/cover no-repeat;color:white;overflow:hidden}
.gateway:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(12,21,25,.20),rgba(12,21,25,.45) 36%,rgba(12,21,25,.45) 64%,rgba(12,21,25,.14)),linear-gradient(0deg,rgba(15,20,25,.26),transparent 45%)}
.topbar{max-width:1400px;margin:auto;min-height:86px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font:700 clamp(1.65rem,3vw,2.4rem)/1 Georgia,"Times New Roman",serif;letter-spacing:-.045em;text-decoration:none;white-space:nowrap;position:relative;padding-bottom:13px}.brand:after{content:"";position:absolute;left:0;bottom:0;width:82px;height:4px;background:var(--gold)}
.topnav{display:flex;align-items:center;gap:26px;font-size:.92rem}.langs{display:flex;align-items:center;gap:9px}.langs a{text-decoration:none;opacity:.75}.langs a[aria-current]{font-weight:700;opacity:1;border-bottom:2px solid var(--gold)}.radio-link{color:#ffd16c;text-decoration:none;font-weight:600;border-left:1px solid #ffffff70;padding-left:26px}.radio-link:hover,.course-link:hover{text-decoration:underline}
.mobile-menu{display:none}
.intro{text-align:center;margin:48px auto 42px;max-width:900px;text-shadow:0 2px 18px #0009}.intro h1{font:normal clamp(2.5rem,5vw,4.6rem)/1.1 Georgia,"Times New Roman",serif;margin:0 0 18px}.intro p{font-size:clamp(1.03rem,1.65vw,1.5rem);margin:0}.accent{width:88px;height:3px;background:var(--gold);margin:30px auto 0}
.course-grid{display:grid;grid-template-columns:repeat(2,minmax(0,350px));justify-content:center;gap:28px;max-width:800px;margin:0 auto}
.course-card{background:var(--cream);border:8px solid #fffaf2;border-radius:17px;overflow:hidden;color:var(--navy);box-shadow:0 15px 42px #0007;text-align:center;display:flex;flex-direction:column}
.course-card img{width:100%;height:210px;object-fit:cover;display:block;border-radius:9px}.course-body{padding:14px 16px 17px;display:flex;flex:1;flex-direction:column;align-items:center}.course-body h2{font:normal 2.05rem/1.2 Georgia,"Times New Roman",serif;margin:0 0 10px}.course-body p{font-size:1.01rem;line-height:1.5;color:#52606b;margin:0 0 20px;min-height:3em}.course-link{margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:200px;padding:12px 20px;border-radius:40px;background:#19445f;color:white;text-decoration:none;font-weight:600}.arabic .course-link{background:#07623e}
.quote-band{min-height:140px;margin:32px calc(-1 * clamp(18px,5vw,90px)) 0;padding:28px clamp(20px,5vw,90px) 32px;background:linear-gradient(180deg,rgba(19,15,15,.08),rgba(18,15,17,.74));text-align:center;display:grid;place-items:center}
.quote-figure{margin:0;max-width:850px;width:100%;padding:0 16px}
.quote-figure blockquote{font:italic clamp(1.15rem,2vw,1.55rem)/1.45 Georgia,"Times New Roman",serif;margin:0;color:#fff8e8;text-shadow:0 2px 9px #000b}
.quote-mark{color:#f4c36a;font:normal 1.35em/0 Georgia,"Times New Roman",serif;vertical-align:-.08em;padding:0 .15em}
.quote-author{margin-top:16px;font:600 .72rem/1.4 Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#e6cba3;text-shadow:0 1px 4px #000b}
a:focus-visible{outline:3px solid #f5b941;outline-offset:4px}
@media(max-width:700px){.gateway{min-height:0;padding:0 16px 0;background:#241a16;overflow:hidden}
/* Mobile: give the panorama a taller presence and fade it smoothly behind the intro. */
.gateway:before{background:linear-gradient(180deg,rgba(9,15,19,.32) 0,rgba(9,15,19,.42) 120px,rgba(20,17,17,.30) 230px,rgba(36,26,22,.55) 310px,#241a16 430px)}
.gateway:after{content:"";position:absolute;z-index:-1;pointer-events:none;top:0;left:0;right:0;height:390px;background:url('library-background-v461.webp') center top/auto 300px no-repeat;opacity:.96;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 54%,rgba(0,0,0,.72) 70%,transparent 98%);mask-image:linear-gradient(to bottom,#000 0%,#000 54%,rgba(0,0,0,.72) 70%,transparent 98%)}
.topnav .radio-link{display:none}.topbar{min-height:75px;align-items:flex-start;padding-top:17px}.brand{font-size:1.5rem}.topnav{gap:13px;flex-direction:row;align-items:center;font-size:.82rem;text-shadow:0 1px 5px #000,0 1px 12px #000}.topnav a{filter:drop-shadow(0 1px 3px #0008)}.radio-link{border:0;padding:0}.langs{gap:12px}
.mobile-menu{display:block;position:relative;z-index:5}
.mobile-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:center;width:35px;height:35px;border:1px solid #ffffffa8;border-radius:7px;background:rgba(13,23,29,.65);color:#fff}
.mobile-menu summary::-webkit-details-marker{display:none}
.mobile-menu summary:focus-visible{outline:3px solid #f5b941;outline-offset:3px}
.menu-bars{display:flex;flex-direction:column;gap:4px}.menu-bars i{display:block;width:17px;height:2px;border-radius:2px;background:currentColor}
.mobile-menu-links{position:absolute;top:calc(100% + 9px);right:0;width:min(255px,calc(100vw - 30px));padding:7px;background:rgba(17,29,34,.97);border:1px solid #d5b77d9c;border-radius:10px;box-shadow:0 12px 32px #0009;text-shadow:none}
.mobile-menu-links a{display:block;padding:12px 13px;text-decoration:none;color:#fff;font-weight:600;font-size:.87rem;line-height:1.35;border-radius:5px}
.mobile-menu-links a+a{border-top:1px solid #ffffff29}.mobile-menu-links a:hover,.mobile-menu-links a:focus-visible{background:#ffffff25}
.intro{margin:38px auto 30px}.intro h1{font-size:clamp(2.2rem,8vw,3.3rem)}.intro p{font-size:1rem}.accent{margin-top:20px}.course-grid{grid-template-columns:minmax(0,350px);gap:20px}.course-card img{height:180px}.course-body p{min-height:0}.quote-band{margin:28px -16px 0;padding:28px 16px 32px;min-height:120px}.quote-figure{padding:0 8px}.quote-mark{font-size:1.2em}}
@media(max-width:360px){.brand{font-size:1.3rem}.topnav{font-size:.72rem}.course-body h2{font-size:1.8rem}}
@media(prefers-reduced-motion:no-preference){.course-link{transition:filter .2s,transform .2s}.course-link:hover{filter:brightness(1.1);transform:translateY(-2px)}}