@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=Archivo:wght@500;600;700&display=swap');
:root{--bg:#111214;--panel:#17191c;--panel2:#1d2024;--cream:#f0ede5;--text:#e8e9e6;--muted:#9ba0a2;--line:#393d40;--lime:#c9ff5b;--blue:#a5d8ff;--pad:clamp(18px,3.2vw,52px)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'IBM Plex Sans Arabic','Segoe UI',sans-serif;line-height:1.7;overflow-x:hidden}a{color:inherit}button{font:inherit}.topbar{position:relative;z-index:10;height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);border-bottom:1px solid var(--line);background:#111214f2}.identity{display:flex;align-items:center;gap:12px;text-decoration:none;direction:ltr}.identity-mark{display:grid;place-items:center;width:39px;height:39px;border:1px solid #63686b;border-radius:50%;font:700 1rem 'Archivo'}.identity b{display:block;font:700 .95rem 'Archivo';letter-spacing:.17em}.identity small{display:block;margin-top:4px;color:#7e8487;font:500 .55rem 'Archivo';letter-spacing:.16em}.topbar nav{display:flex;gap:34px}.topbar nav a{text-decoration:none;color:#afb3b4;font-size:.9rem}.topbar nav a:hover{color:var(--cream)}.nav-tools{display:flex;align-items:center;gap:18px;direction:ltr}.live{font:600 .62rem 'Archivo';letter-spacing:.12em;color:#9da2a4}.live i,.ready i{display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 9px #c9ff5b88}.menu{display:none;width:40px;height:40px;border:1px solid #4d5154;background:transparent}.menu span{display:block;width:16px;height:1px;margin:5px auto;background:#ddd}
.hero-shell{padding:18px var(--pad) 0}.hero-frame{position:relative;isolation:isolate;min-height:calc(100svh - 150px);display:flex;align-items:center;overflow:hidden;border:1px solid #555a5d;border-radius:18px;background:#0b0c0e}.hero-image{position:absolute;z-index:-3;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}.hero-frame:after{content:"";position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,#0b0c0ef2 3%,#0b0c0ecb 38%,#0b0c0e38 67%),linear-gradient(0deg,#0b0c0eb8,transparent 40%)}.scanlines{position:absolute;z-index:-1;inset:0;background:repeating-linear-gradient(0deg,transparent 0 4px,#ffffff05 5px);mix-blend-mode:overlay;pointer-events:none}.hero-copy{width:min(680px,54%);padding:clamp(40px,6vw,90px)}.micro,.corner-label{font:600 .59rem 'Archivo';letter-spacing:.2em;color:#939a9e}.hero-copy h1{margin:20px 0 22px;font-size:clamp(3.5rem,7.5vw,7.5rem);line-height:.95;letter-spacing:-.045em}.hero-copy h1 em{font-style:normal;color:var(--cream)}.hero-copy p{max-width:560px;margin:0;color:#b3b8b9;font-size:clamp(1rem,1.45vw,1.18rem)}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.solid-btn,.line-btn{display:inline-flex;align-items:center;gap:30px;padding:12px 17px;text-decoration:none;font-weight:700}.solid-btn{background:var(--cream);color:#151719}.solid-btn:hover{background:var(--lime)}.line-btn{border:1px solid #606568}.corner-label{position:absolute}.top-left{top:19px;left:22px}.bottom-right{bottom:18px;right:22px}.frame-counter{position:absolute;top:18px;right:22px;display:flex;align-items:baseline;gap:6px;direction:ltr;font-family:'Archivo'}.frame-counter span{font-size:1.65rem}.frame-counter small{color:#767d80}.hero-console{display:grid;grid-template-columns:repeat(4,1fr) auto;border:1px solid #44484b;border-top:0}.hero-console>div,.hero-console>button{min-height:72px;padding:13px 18px;border:0;border-left:1px solid #44484b;background:#151719;text-align:right}.hero-console small{display:block;color:#737a7d;font:500 .57rem 'Archivo';letter-spacing:.13em}.hero-console strong{display:block;margin-top:5px;font:600 1.03rem 'Archivo'}.hero-console button{color:#aeb3b5;font:600 .62rem 'Archivo';letter-spacing:.1em;cursor:pointer}.hero-console button b{color:var(--lime)}
.intro{display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;padding:130px var(--pad)}.intro-title>span,.section-head span,.strip-label>span,.closing>div>span{color:#777e81;font:600 .61rem 'Archivo';letter-spacing:.2em}.intro h2,.section-head h2,.closing h2{margin:14px 0 0;font-size:clamp(3rem,7vw,7rem);line-height:.92;letter-spacing:-.05em}.intro h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1px #777d80}.intro-copy{align-self:end}.intro-copy>p{margin:0 0 30px;color:#b0b5b6;font-size:1.08rem}.principles{display:grid;border-top:1px solid var(--line)}.principles span{display:flex;gap:20px;padding:12px 0;border-bottom:1px solid var(--line)}.principles b{font:600 .75rem 'Archivo';color:var(--lime)}
.projects{padding:0 var(--pad) 120px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:35px}.section-head p{max-width:430px;margin:0;color:var(--muted)}.project-mosaic{display:grid;grid-template-columns:1.2fr .8fr 1fr;grid-template-rows:360px 300px 330px;gap:8px}.tile{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:22px;border:1px solid #454a4d;border-radius:13px;background:var(--panel);text-decoration:none;transition:background .2s,transform .2s}.tile:hover{background:#22262a;transform:translateY(-2px)}.tile.english{grid-row:span 2;background:#e8e4dc;color:#151719}.tile.visual{grid-column:span 2;margin:0;padding:0}.tile.chinese{background:#2b181a}.tile.lab{grid-column:span 2}.tile.game{background:#25212e}.tile-meta,.tile-foot{display:flex;justify-content:space-between;gap:18px;align-items:start}.tile-meta>span,.tile-foot{font:600 .6rem 'Archivo';letter-spacing:.13em}.tile-meta b{display:grid;place-items:center;width:48px;height:48px;border:1px solid currentColor;border-radius:50%;font:600 1rem 'Archivo'}.tile-body{margin:auto 0}.tile-body small{color:#767d80}.english .tile-body small{color:#606467}.tile h3{margin:5px 0 12px;font-size:clamp(2.1rem,4.2vw,4.7rem);line-height:.88;letter-spacing:-.045em}.tile p{max-width:440px;margin:0;color:#9da3a5}.english p{color:#555a5c}.tile-foot{align-items:center;padding-top:15px;border-top:1px solid currentColor;color:#737a7d}.english .tile-foot{color:#5e6263}.tile-foot strong{font-family:'IBM Plex Sans Arabic';font-size:.8rem;color:inherit}.visual img{width:100%;height:100%;object-fit:cover}.visual figcaption{position:absolute;left:18px;right:18px;bottom:15px;display:flex;justify-content:space-between;padding:10px 12px;border:1px solid #ffffff36;background:#0c0d0ebd;backdrop-filter:blur(9px);font:600 .58rem 'Archivo';letter-spacing:.12em}.quran{background:#252118}.lab{background:#172323}
.learning-strip{display:grid;grid-template-columns:1.2fr repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.strip-label,.method{min-height:250px;padding:30px var(--pad);border-left:1px solid var(--line)}.strip-label h2{margin:14px 0;font-size:clamp(2rem,4vw,4rem);line-height:1}.method{display:flex;gap:20px;align-items:flex-start}.method>span{font:600 .68rem 'Archivo';color:var(--lime)}.method h3{margin:0;font-size:1.8rem}.method p{color:var(--muted)}.closing{display:grid;grid-template-columns:1.3fr .7fr;gap:7vw;align-items:end;padding:130px var(--pad)}.closing-side{padding-bottom:10px}.closing-side p{color:var(--muted);font-size:1.05rem}.closing-side a{display:flex;justify-content:space-between;margin-top:28px;padding:14px 0;border-top:1px solid #696f72;text-decoration:none;font-weight:700}footer{display:flex;align-items:center;gap:40px;padding:30px var(--pad);border-top:1px solid var(--line);color:#7e8588}footer p{margin:0}footer>div{display:flex;gap:22px;margin-inline-start:auto;direction:ltr}footer>div a{font:600 .59rem 'Archivo';letter-spacing:.12em;text-decoration:none}
@media(max-width:900px){.topbar nav{display:none;position:absolute;top:78px;left:0;right:0;flex-direction:column;padding:20px;background:#111214f5;border-bottom:1px solid var(--line)}.topbar.open nav{display:flex}.menu{display:block}.live{display:none}.hero-frame{min-height:740px;align-items:end}.hero-image{object-position:65% center}.hero-frame:after{background:linear-gradient(0deg,#0b0c0ef6 9%,#0b0c0ec8 52%,#0b0c0e33 83%)}.hero-copy{width:100%;padding:45px 24px 78px}.hero-copy h1{font-size:clamp(3.1rem,14vw,6rem)}.hero-console{grid-template-columns:repeat(2,1fr)}.hero-console>button{grid-column:span 2}.intro{grid-template-columns:1fr;padding-top:90px;padding-bottom:90px}.project-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:auto}.tile,.tile.english,.tile.visual,.tile.lab{grid-column:auto;grid-row:auto;min-height:350px}.tile.english,.tile.visual{grid-column:span 2}.learning-strip{grid-template-columns:1fr 1fr}.strip-label{grid-column:span 2}.closing{grid-template-columns:1fr}footer{align-items:flex-start;flex-direction:column}footer>div{margin:0}}@media(max-width:560px){.topbar{height:70px}.identity small{display:none}.hero-shell{padding:10px}.hero-frame{min-height:650px;border-radius:12px}.corner-label.bottom-right{display:none}.hero-copy h1{font-size:3.35rem}.hero-actions{align-items:stretch;flex-direction:column}.solid-btn,.line-btn{justify-content:space-between}.hero-console{margin:0 10px}.hero-console>div{padding:11px}.intro,.projects,.closing{padding-left:18px;padding-right:18px}.section-head{align-items:start;flex-direction:column}.project-mosaic{grid-template-columns:1fr}.tile,.tile.english,.tile.visual,.tile.lab{grid-column:auto;min-height:330px}.tile.visual{min-height:250px}.learning-strip{grid-template-columns:1fr}.strip-label{grid-column:auto}.strip-label,.method{min-height:180px;border-left:0;border-bottom:1px solid var(--line);padding:26px 20px}.closing h2{font-size:3.4rem}footer>div{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.tile{transition:none}}