    /* ============================================================
       RESET & VARIABLES (RTL)
    ============================================================ */
    *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
    html { scroll-behavior: smooth; overflow-x: hidden; max-width: 100%; }
    a { text-decoration: none; color: inherit; }
    ul { list-style: none; }

    :root {
      --bg:           #070B14;
      --surface:      #0D1524;
      --surface-2:    #111C30;
      --surface-3:    #18243E;
      --border:       rgba(139,92,246,.10);
      --border-h:     rgba(139,92,246,.40);
      --primary:      #8B5CF6;
      --primary-dim:  #6D28D9;
      --primary-100:  #DDD6FE;
      --primary-glow: rgba(139,92,246,.20);
      --amber:        #F59E0B;
      --amber-dim:    rgba(245,158,11,.10);
      --emerald:      #10B981;
      --emerald-dim:  rgba(16,185,129,.10);
      --text:         #F1F5F9;
      --text-2:       #CBD5E1;
      --text-m:       #94A3B8;
      --text-d:       #475569;
      --r:            14px;
      --r-lg:         22px;
      --t:            0.3s cubic-bezier(.4,0,.2,1);
    }

    body {
      background: var(--bg);
      color: var(--text);
      font-family: 'Noto Kufi Arabic', system-ui, sans-serif;
      line-height: 1.8;
      overflow-x: hidden;
      max-width: 100%;
      direction: rtl;
    }
    h1,h2,h3,h4 { font-family: 'Noto Kufi Arabic', sans-serif; line-height: 1.3; }

    .container { max-width: 1100px; margin: 0 auto; padding: 0 24px; }
    .section   { padding: 110px 0; }

    /* utilities */
    .grad-text {
      background: linear-gradient(135deg,#A78BFA 0%,#F59E0B 100%);
      -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
    }
    .section-label {
      display: inline-flex; align-items: center; gap: 8px;
      font-family: 'Fira Code',monospace; font-size: 11px; font-weight: 500;
      color: var(--primary); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 14px;
      direction: ltr;
    }
    .section-label::after { content:''; width:18px; height:1px; background:var(--primary); }
    .section-title { font-size: clamp(26px,4vw,40px); font-weight:800; margin-bottom:12px; }
    .section-sub   { font-size:16px; color:var(--text-m); max-width:520px; }

    /* cards */
    .card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:28px; transition:border-color var(--t),transform var(--t),box-shadow var(--t); }
    .card:hover { border-color:var(--border-h); transform:translateY(-3px); box-shadow:0 20px 60px rgba(0,0,0,.4),0 0 40px var(--primary-glow); }

    /* tags */
    .tag   { display:inline-flex; align-items:center; padding:4px 10px; border-radius:6px; font-size:11.5px; font-family:'Fira Code',monospace; font-weight:500; background:var(--surface-2); border:1px solid var(--border); color:var(--text-m); white-space:nowrap; direction:ltr; }
    .tag-v { background:var(--primary-glow); border-color:rgba(139,92,246,.3); color:var(--primary-100); }
    .tag-a { background:var(--amber-dim); border-color:rgba(245,158,11,.28); color:#FCD34D; }
    .tag-g { background:var(--emerald-dim); border-color:rgba(16,185,129,.28); color:#6EE7B7; }

    /* buttons */
    .btn { display:inline-flex; align-items:center; gap:8px; padding:12px 24px; border-radius:var(--r); font-weight:700; font-size:14px; cursor:pointer; border:none; transition:all var(--t); font-family:'Noto Kufi Arabic',sans-serif; }
    .btn-amber { background:linear-gradient(135deg,#B45309,var(--amber)); color:#1C1200; box-shadow:0 4px 20px rgba(245,158,11,.22); }
    .btn-amber:hover { box-shadow:0 8px 32px rgba(245,158,11,.40); transform:translateY(-1px); }
    .btn-primary { background:linear-gradient(135deg,var(--primary-dim),var(--primary)); color:#fff; box-shadow:0 4px 20px var(--primary-glow); }
    .btn-primary:hover { box-shadow:0 8px 32px rgba(139,92,246,.45); transform:translateY(-1px); }
    .btn-ghost { background:transparent; color:var(--text-2); border:1px solid var(--border); }
    .btn-ghost:hover { border-color:var(--border-h); color:var(--text); background:var(--surface); }

    /* reveal */
    .reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }
    .reveal.visible { opacity:1; transform:translateY(0); }

    /* â”€â”€ NAV â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    #nav { position:fixed; top:0; left:0; right:0; z-index:100; padding:0 24px; transition:background var(--t); }
    #nav.scrolled { background:rgba(7,11,20,.88); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); }
    .nav-inner { max-width:1100px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; height:66px; }
    .nav-logo { font-family:'Noto Kufi Arabic',sans-serif; font-size:20px; font-weight:900; background:linear-gradient(135deg,#A78BFA,#F59E0B); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
    .nav-links { display:flex; align-items:center; gap:2px; }
    .nav-links a { padding:7px 13px; border-radius:9px; font-size:14px; font-weight:600; color:var(--text-m); transition:color var(--t),background var(--t); }
    .nav-links a:hover { color:var(--text); background:var(--surface); }
    .nav-lang { display:inline-flex; align-items:center; gap:6px; padding:7px 14px; border-radius:9px; font-size:13px; font-weight:600; color:var(--text-m); border:1px solid var(--border); transition:all var(--t); direction:ltr; }
    .nav-lang:hover { border-color:var(--border-h); color:var(--text); background:var(--surface); }
    .nav-gh { display:inline-flex; align-items:center; gap:7px; padding:8px 16px; border-radius:9px; font-size:13px; font-weight:600; color:var(--primary-100)!important; border:1px solid rgba(139,92,246,.3); background:var(--primary-glow)!important; transition:all var(--t)!important; direction:ltr; }
    .nav-gh:hover { border-color:var(--primary)!important; box-shadow:0 0 20px var(--primary-glow); }
    .mob-btn { display:none; background:none; border:none; color:var(--text); cursor:pointer; padding:8px; }
    .nav-links.open { display:flex!important; flex-direction:column; position:fixed; top:66px; left:0; right:0; background:rgba(7,11,20,.97); backdrop-filter:blur(20px); border-bottom:1px solid var(--border); padding:16px 24px 24px; gap:4px; z-index:99; }
    .nav-links.open a { width:100%; padding:11px 14px; }

    /* â”€â”€ HERO â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    #hero { min-height:100vh; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; padding:100px 24px 60px; }
    .hero-bg { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
    .orb { position:absolute; border-radius:50%; filter:blur(80px); opacity:.35; animation:drift 25s ease-in-out infinite; }
    .orb-1 { width:560px; height:560px; background:radial-gradient(circle,rgba(139,92,246,.65) 0%,transparent 70%); top:-8%; left:-6%; animation-duration:28s; }
    .orb-2 { width:420px; height:420px; background:radial-gradient(circle,rgba(245,158,11,.42) 0%,transparent 70%); bottom:-4%; right:-4%; animation-delay:-10s; animation-duration:32s; }
    .orb-3 { width:300px; height:300px; background:radial-gradient(circle,rgba(56,189,248,.28) 0%,transparent 70%); top:38%; right:28%; animation-delay:-18s; animation-duration:22s; }
    @keyframes drift { 0%,100%{transform:translate(0,0) scale(1);} 25%{transform:translate(-28px,-22px) scale(1.04);} 50%{transform:translate(18px,28px) scale(.96);} 75%{transform:translate(-20px,18px) scale(1.02);} }
    .hero-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(139,92,246,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(139,92,246,.035) 1px,transparent 1px); background-size:64px 64px; mask-image:radial-gradient(ellipse at center,black 25%,transparent 78%); }

    .hero-content { position:relative; z-index:2; max-width:800px; text-align:center; }

    .avatar { width:248px; height:248px; border-radius:50%; margin:0 auto 36px; position:relative; display:flex; align-items:center; justify-content:center; }
    .av-glow { position:absolute; inset:-12px; border-radius:50%; background:radial-gradient(circle,rgba(139,92,246,.28) 0%,transparent 70%); animation:pglow 3s ease-in-out infinite; z-index:-1; }
    @keyframes pglow { 0%,100%{opacity:.5;transform:scale(1);} 50%{opacity:1;transform:scale(1.1);} }
    .av-ring { position:absolute; inset:-3px; border-radius:50%; background:conic-gradient(from 0deg,#8B5CF6,#F59E0B,#8B5CF6); animation:spin 8s linear infinite; z-index:0; }
    @keyframes spin { to{transform:rotate(360deg);} }
    .av-inner { position:relative; z-index:1; width:240px; height:240px; border-radius:50%; background:linear-gradient(145deg,#131D35,#1A2444); border:3px solid var(--bg); display:flex; align-items:center; justify-content:center; font-size:38px; font-weight:900; overflow:hidden; }
    .av-initials { background:linear-gradient(135deg,#A78BFA,#FCD34D); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

    .hero-name { font-size:clamp(40px,7vw,76px); font-weight:900; line-height:1.1; margin-bottom:16px; }
    .hero-name span { background:linear-gradient(135deg,#A78BFA 0%,#FCD34D 55%,#A78BFA 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; background-size:200%; animation:shimmer 4s linear infinite; }
    @keyframes shimmer { 0%{background-position:0%} 100%{background-position:200%} }

    .hero-sub { font-size:clamp(16px,2.4vw,22px); color:var(--primary-100); font-weight:600; margin-bottom:18px; min-height:1.7em; }
    .hero-tag { font-size:clamp(14px,1.8vw,17px); color:var(--text-2); max-width:600px; margin:0 auto 36px; line-height:1.9; }

    .hero-ctas { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; margin-bottom:56px; }

    .hero-stats { display:flex; align-items:center; justify-content:center; gap:36px; flex-wrap:wrap; }
    .stat { text-align:center; }
    .stat-num { font-family:'Fira Code',monospace; font-size:30px; font-weight:900; background:linear-gradient(135deg,#A78BFA,#F59E0B); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
    .stat-lbl { font-size:11px; color:var(--text-d); margin-top:2px; }
    .stat-div { width:1px; height:38px; background:var(--border); }

    .scroll-ind { position:absolute; bottom:28px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:7px; color:var(--text-d); font-size:10px; animation:floatY 2.5s ease-in-out infinite; }
    .scroll-mouse { width:22px; height:34px; border:2px solid var(--text-d); border-radius:11px; display:flex; justify-content:center; padding-top:6px; }
    .scroll-whl { width:3px; height:6px; background:var(--text-d); border-radius:2px; animation:whl 2s ease-in-out infinite; }
    @keyframes whl { 0%,100%{transform:translateY(0);opacity:1;} 50%{transform:translateY(5px);opacity:.3;} }
    @keyframes floatY { 0%,100%{transform:translateX(-50%) translateY(0);} 50%{transform:translateX(-50%) translateY(-6px);} }

    /* â”€â”€ VENTURE SHARED â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    .venture-feature { border-radius:28px; padding:60px; position:relative; overflow:hidden; transition:border-color var(--t),box-shadow var(--t); }

    /* â”€â”€ KHAYALKIDS â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    #khayalkids { padding:80px 0 40px; }
    .kk-wrap { background:linear-gradient(140deg,rgba(13,21,36,.97) 0%,rgba(28,14,50,.65) 100%); border:1px solid rgba(245,158,11,.22); }
    .kk-wrap:hover { border-color:rgba(245,158,11,.42); box-shadow:0 32px 88px rgba(0,0,0,.52),0 0 64px rgba(245,158,11,.07); }
    .kk-wrap::before { content:''; position:absolute; top:0; left:0; width:320px; height:320px; background:radial-gradient(circle at top left,rgba(245,158,11,.13) 0%,transparent 68%); pointer-events:none; }
    .kk-wrap::after  { content:''; position:absolute; bottom:0; right:0; width:220px; height:220px; background:radial-gradient(circle at bottom right,rgba(139,92,246,.09) 0%,transparent 70%); pointer-events:none; }
    .v-badge { display:inline-flex; align-items:center; gap:7px; padding:6px 14px; border-radius:999px; font-size:11.5px; font-weight:700; letter-spacing:.04em; margin-bottom:24px; }
    .kk-badge { border:1px solid rgba(245,158,11,.4); background:var(--amber-dim); color:var(--amber); }
    .aa-badge { border:1px solid rgba(139,92,246,.4); background:var(--primary-glow); color:var(--primary-100); }
    .v-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:28px; }
    .v-title { font-size:clamp(32px,5vw,52px); font-weight:900; margin-bottom:10px; }
    .kk-title-en { font-size:clamp(16px,2.2vw,22px); color:var(--amber); font-weight:500; margin-bottom:8px; font-family:'Fira Code',monospace; direction:ltr; text-align:right; }
    .v-role { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:7px; font-size:12px; font-family:'Fira Code',monospace; }
    .kk-role { background:var(--amber-dim); border:1px solid rgba(245,158,11,.22); color:#FCD34D; }
    .aa-role { background:var(--primary-glow); border:1px solid rgba(139,92,246,.22); color:var(--primary-100); }
    .v-acts { display:flex; gap:10px; flex-shrink:0; flex-wrap:wrap; align-self:flex-start; margin-top:8px; }
    .v-desc { font-size:15.5px; color:var(--text-2); line-height:1.9; max-width:700px; margin-bottom:32px; }
    .v-desc em { color:var(--text-d); font-size:14px; font-style:italic; }
    .v-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:14px; margin-bottom:32px; }
    .v-hl { border-radius:var(--r); padding:16px; display:flex; align-items:flex-start; gap:12px; transition:background var(--t),border-color var(--t); }
    .kk-hl { background:rgba(245,158,11,.04); border:1px solid rgba(245,158,11,.11); }
    .kk-hl:hover { background:rgba(245,158,11,.09); border-color:rgba(245,158,11,.24); }
    .aa-hl { background:rgba(139,92,246,.04); border:1px solid rgba(139,92,246,.11); }
    .aa-hl:hover { background:rgba(139,92,246,.09); border-color:rgba(139,92,246,.24); }
    .v-hl-ico { font-size:20px; flex-shrink:0; margin-top:2px; }
    .v-hl-h  { font-size:13px; font-weight:700; color:var(--text); margin-bottom:3px; }
    .v-hl-p  { font-size:12px; color:var(--text-m); line-height:1.6; }
    .v-tags  { display:flex; flex-wrap:wrap; gap:8px; }

    /* â”€â”€ AI-ASAAS â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    #aiasaas { padding:40px 0 80px; }
    .aa-wrap { background:linear-gradient(140deg,rgba(13,21,36,.97) 0%,rgba(10,20,40,.8) 100%); border:1px solid rgba(139,92,246,.22); }
    .aa-wrap:hover { border-color:rgba(139,92,246,.44); box-shadow:0 32px 88px rgba(0,0,0,.52),0 0 64px rgba(139,92,246,.07); }
    .aa-wrap::before { content:''; position:absolute; top:0; left:0; width:300px; height:300px; background:radial-gradient(circle at top left,rgba(139,92,246,.12) 0%,transparent 68%); pointer-events:none; }
    .aa-title-en { font-size:clamp(16px,2.2vw,22px); color:var(--primary); font-weight:500; margin-bottom:8px; font-family:'Fira Code',monospace; direction:ltr; text-align:right; }

    /* â”€â”€ EXPERIENCE â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    .exp-cols { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; margin-top:48px; }
    .exp-col-lbl { font-size:11px; font-family:'Fira Code',monospace; letter-spacing:.08em; text-transform:uppercase; display:flex; align-items:center; gap:8px; margin-bottom:22px; direction:ltr; justify-content:flex-end; }
    .exp-col-lbl.cur  { color:var(--emerald); }
    .exp-col-lbl.past { color:var(--text-d); }
    .lbl-dot { width:8px; height:8px; border-radius:50%; background:var(--emerald); animation:blink 2s infinite; }
    @keyframes blink { 0%,100%{opacity:1;} 50%{opacity:.2;} }
    .timeline { position:relative; padding-right:36px; }
    .timeline::before { content:''; position:absolute; right:10px; top:8px; bottom:0; width:1px; background:linear-gradient(to bottom,var(--primary),transparent); }
    .tl-item  { position:relative; margin-bottom:22px; }
    .tl-item:last-child { margin-bottom:0; }
    .tl-dot { position:absolute; right:-31px; top:7px; width:13px; height:13px; border-radius:50%; background:var(--surface); border:2px solid var(--border); }
    .tl-dot.active { border-color:var(--emerald); background:var(--emerald); box-shadow:0 0 10px rgba(16,185,129,.55); animation:dot-pulse 2s ease-in-out infinite; }
    .tl-dot.past   { border-color:var(--text-d); background:var(--text-d); }
    @keyframes dot-pulse { 0%,100%{box-shadow:0 0 8px rgba(16,185,129,.4);} 50%{box-shadow:0 0 20px rgba(16,185,129,.75);} }
    .tl-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; transition:border-color var(--t),box-shadow var(--t); }
    .tl-card:hover { border-color:var(--border-h); box-shadow:0 10px 40px rgba(0,0,0,.3); }
    .tl-co     { font-size:10.5px; font-family:'Fira Code',monospace; color:var(--text-d); text-transform:uppercase; letter-spacing:.08em; margin-bottom:4px; direction:ltr; text-align:right; }
    .tl-role   { font-size:17px; font-weight:700; margin-bottom:3px; }
    .tl-period { font-size:11.5px; font-family:'Fira Code',monospace; color:var(--text-d); margin-bottom:10px; direction:ltr; text-align:right; }
    .tl-desc   { font-size:13.5px; color:var(--text-m); line-height:1.75; margin-bottom:12px; }
    .tl-tags   { display:flex; flex-wrap:wrap; gap:6px; }

    /* â”€â”€ PROJECTS â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    .proj-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:18px; margin-top:48px; }
    .proj-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:26px; display:flex; flex-direction:column; transition:all var(--t); position:relative; overflow:hidden; }
    .proj-card::before { content:''; position:absolute; top:0; right:0; left:0; height:2px; background:linear-gradient(90deg,var(--amber),var(--primary)); transform:scaleX(0); transform-origin:right; transition:transform var(--t); }
    .proj-card:hover::before { transform:scaleX(1); }
    .proj-card:hover { border-color:var(--border-h); transform:translateY(-3px); box-shadow:0 20px 60px rgba(0,0,0,.42),0 0 40px var(--primary-glow); }
    .proj-type { font-size:11px; font-family:'Fira Code',monospace; color:var(--text-d); margin-bottom:10px; direction:ltr; text-align:right; }
    .proj-name { font-size:18px; font-weight:700; margin-bottom:8px; }
    .proj-desc { font-size:13.5px; color:var(--text-m); line-height:1.75; flex:1; margin-bottom:18px; }
    .proj-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; }
    .proj-tags { display:flex; flex-wrap:wrap; gap:6px; }
    .proj-row  { display:flex; align-items:center; gap:8px; flex-shrink:0; direction:ltr; }
    .stars { display:flex; align-items:center; gap:3px; font-size:12px; color:var(--amber); font-family:'Fira Code',monospace; }
    .icon-btn { display:flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:8px; background:var(--surface-2); border:1px solid var(--border); color:var(--text-m); transition:all var(--t); }
    .icon-btn:hover { border-color:var(--border-h); color:var(--text); }

    /* â”€â”€ SKILLS â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    .skills-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; margin-top:48px; }
    .skill-grp { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; transition:border-color var(--t); }
    .skill-grp:hover { border-color:var(--border-h); }
    .skill-grp-ttl { font-size:13px; font-weight:700; color:var(--primary-100); margin-bottom:14px; display:flex; align-items:center; gap:6px; }
    .skill-grp-ttl::before { content:'#'; color:var(--primary); font-family:'Fira Code',monospace; }
    .skill-tags { display:flex; flex-wrap:wrap; gap:7px; }

    /* â”€â”€ OSS â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    .oss-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:18px; margin-top:48px; }
    .oss-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:26px; display:flex; flex-direction:column; gap:14px; transition:all var(--t); }
    .oss-card:hover { border-color:var(--border-h); transform:translateY(-2px); box-shadow:0 14px 48px rgba(0,0,0,.38); }
    .oss-org  { font-size:10.5px; font-family:'Fira Code',monospace; color:var(--text-d); direction:ltr; text-align:right; }
    .oss-name { font-size:20px; font-weight:800; }
    .oss-desc { font-size:13.5px; color:var(--text-m); line-height:1.78; flex:1; }
    .oss-tags { display:flex; flex-wrap:wrap; gap:7px; }
    .oss-stats { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
    .oss-stat-n { font-family:'Fira Code',monospace; font-size:28px; font-weight:900; background:linear-gradient(135deg,#A78BFA,#F59E0B); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
    .oss-stat-l { font-size:10.5px; color:var(--text-d); font-family:'Fira Code',monospace; margin-top:2px; }

    /* â”€â”€ WRITING â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    .writing-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:18px; margin-top:48px; }
    .writing-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:22px; display:flex; flex-direction:column; gap:10px; transition:all var(--t); }
    .writing-card:hover { border-color:var(--border-h); transform:translateY(-2px); }
    .writing-topic { font-size:10.5px; color:var(--primary); letter-spacing:.04em; font-weight:700; }
    .writing-ttl   { font-size:15px; font-weight:700; line-height:1.5; }
    .writing-pre   { font-size:13px; color:var(--text-m); line-height:1.78; }
    .writing-meta  { display:flex; align-items:center; justify-content:space-between; font-size:11.5px; color:var(--text-d); padding-top:8px; border-top:1px solid var(--border); margin-top:auto; }

    /* â”€â”€ EDUCATION â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    .edu-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-lg); padding:40px; display:flex; align-items:center; gap:32px; flex-wrap:wrap; transition:border-color var(--t); }
    .edu-card:hover { border-color:var(--border-h); }
    .edu-ico { font-size:52px; flex-shrink:0; }
    .edu-deg { font-size:21px; font-weight:800; margin-bottom:6px; }
    .edu-uni { font-size:15px; color:var(--text-m); margin-bottom:14px; }
    .edu-tags { display:flex; flex-wrap:wrap; gap:9px; }

    /* â”€â”€ CONTACT â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    #contact { padding:100px 0 70px; text-align:center; position:relative; overflow:hidden; }
    .contact-glow { position:absolute; top:0; left:50%; transform:translateX(-50%); width:100%; max-width:600px; height:300px; background:radial-gradient(ellipse,rgba(139,92,246,.07) 0%,transparent 70%); pointer-events:none; }
    .contact-ttl { font-size:clamp(30px,5vw,52px); font-weight:900; margin-bottom:14px; }
    .contact-sub { font-size:16px; color:var(--text-m); margin-bottom:40px; }
    .contact-links { display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }
    .c-link { display:inline-flex; align-items:center; gap:10px; padding:14px 28px; border-radius:var(--r); font-weight:700; font-size:14px; border:1px solid var(--border); color:var(--text-2); background:var(--surface); transition:all var(--t); }
    .c-link:hover { border-color:var(--border-h); color:var(--text); transform:translateY(-2px); box-shadow:0 10px 40px rgba(0,0,0,.3); }

    /* â”€â”€ FOOTER â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    footer { padding:22px 24px; border-top:1px solid var(--border); text-align:center; color:var(--text-d); font-size:13px; }
    footer span.hi { background:linear-gradient(135deg,#A78BFA,#F59E0B); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }

    /* â”€â”€ RESPONSIVE â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
    @media(max-width:820px) {
      .avatar { width:208px; height:208px; margin:0 auto 28px; }
      .av-inner { width:200px; height:200px; }
      .nav-links { display:none; }
      .mob-btn { display:block; }
      .venture-feature { padding:30px 20px; }
      .v-head { flex-direction:column; }
      .exp-cols { grid-template-columns:1fr; gap:28px; }
      .edu-card { padding:28px 20px; flex-direction:column; gap:18px; }
    }
    @media(max-width:500px) {
      .avatar { width:168px; height:168px; margin:0 auto 24px; }
      .av-inner { width:160px; height:160px; }
      .hero-stats { gap:20px; }
      .hero-ctas { flex-direction:column; align-items:stretch; }
      .btn { justify-content:center; }
      .stat-div { display:none; }
      .section { padding:80px 0; }
      .proj-grid, .skills-grid, .oss-grid, .writing-grid, .v-grid { grid-template-columns: 1fr; }
    }
