
  :root{
    --bg-0:#010F1C;
    --bg-1:#05192C;
    --bg-2:#0B2740;
    --bg-2-hover:#0F2E4C;
    --line:rgba(255,255,255,.08);
    --line-strong:rgba(255,255,255,.16);
    --ink:#F3F8FC;
    --ink-dim:#9FB2C4;
    --ink-faint:#5E7893;
    --emerald:#43CB96;
    --teal:#127499;
    --blue:#5B9CFF;
    --violet:#6A2AE9;
    --live:#FF4D67;
    --grad-brand:linear-gradient(135deg,var(--emerald),var(--teal));
    --grad-logo:linear-gradient(135deg,#3DBF62 0%,#229386 28%,#0766AA 56%,#3848CA 78%,#6A2AE9 100%);
    --radius-lg:22px;
    --radius-md:16px;
    --font-display:'Cairo','Segoe UI',Tahoma,Arial,sans-serif;
    --font-body:'Tajawal','Segoe UI',Tahoma,Arial,sans-serif;
    --container:1180px;
    color-scheme: dark;
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
  }

  html{direction:rtl;}
  body{
    margin:0;
    direction:rtl;
    background:var(--bg-0);
    color:var(--ink);
    font-family:var(--font-body);
    line-height:1.8;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  img,svg{max-width:100%;display:block;}

  a{color:inherit;text-decoration:none;}

  .ltr{direction:ltr;unicode-bidi:isolate;display:inline-block;}

  .wrap{
    width:100%;
    max-width:var(--container);
    margin-inline:auto;
    padding-inline:clamp(1.25rem,4vw,2.5rem);
  }

  h1,h2,h3{
    font-family:var(--font-display);
    color:var(--ink);
    margin:0;
    text-wrap:balance;
  }

  p{margin:0;}

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    font-family:var(--font-display);
    font-weight:700;
    font-size:.8rem;
    letter-spacing:.04em;
    color:var(--emerald);
    background:rgba(67,203,150,.1);
    border:1px solid rgba(67,203,150,.28);
    padding:.4rem .9rem;
    border-radius:99px;
  }
  .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--grad-brand);flex:none;}

  .h2-underline{
    display:block;
    width:64px;
    height:6px;
    border-radius:99px;
    background:var(--grad-brand);
    margin-block:1rem 1.25rem;
  }
  [dir="rtl"] .h2-underline{margin-inline-start:2px;}

  .section-head{max-width:640px;}
  .section-head p{color:var(--ink-dim);font-size:1.05rem;margin-top:.9rem;}

  .badge-new{
    display:inline-flex;align-items:center;gap:.35rem;
    font-family:var(--font-display);font-weight:800;font-size:.68rem;letter-spacing:.03em;
    color:#04140C;background:var(--grad-brand);
    padding:.28rem .6rem;border-radius:99px;
  }
  .badge-soon{
    display:inline-flex;align-items:center;gap:.35rem;
    font-family:var(--font-display);font-weight:700;font-size:.68rem;
    color:var(--ink-dim);background:var(--bg-2);border:1px solid var(--line-strong);
    padding:.28rem .6rem;border-radius:99px;
  }

  /* ---------- buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
    font-family:var(--font-display);font-weight:700;font-size:.95rem;
    padding:.9rem 1.6rem;border-radius:99px;border:1px solid transparent;
    cursor:pointer;white-space:nowrap;transition:transform .25s ease, box-shadow .25s ease, background-position .5s ease;
  }
  .btn:focus-visible{outline:2px solid var(--emerald);outline-offset:3px;}
  .btn-primary{
    position:relative;overflow:hidden;
    background:var(--grad-brand);background-size:160% 160%;background-position:0% 0%;
    color:#03140D;box-shadow:0 10px 30px -12px rgba(67,203,150,.55);
  }
  .btn-primary:hover{transform:translateY(-2px);background-position:100% 100%;box-shadow:0 16px 34px -12px rgba(18,116,153,.6);}
  .btn-primary::after{
    content:"";position:absolute;inset-block:0;inset-inline-start:-60%;width:40%;
    background:linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);
    transform:skewX(-20deg);pointer-events:none;
  }
  .btn-primary:hover::after{animation:shimmer-sweep 1.1s ease;}
  @keyframes shimmer-sweep{
    0%{inset-inline-start:-60%;}
    100%{inset-inline-start:130%;}
  }
  .btn-ghost{
    background:rgba(255,255,255,.03);color:var(--ink);border-color:var(--line-strong);
  }
  .btn-ghost:hover{transform:translateY(-2px);border-color:var(--emerald);background:rgba(67,203,150,.08);}
  .btn-sm{padding:.6rem 1.1rem;font-size:.82rem;}
  .btn svg{width:18px;height:18px;flex:none;}

  /* ---------- scroll progress ---------- */
  #scrollProgress{
    position:fixed;top:0;inset-inline-start:0;height:3px;width:0%;
    background:var(--grad-brand);z-index:80;transition:width .1s linear;
  }

  /* ---------- header ---------- */
  header{
    position:sticky;top:0;z-index:50;
    padding-block:1.1rem;
    transition:background-color .35s ease, box-shadow .35s ease, backdrop-filter .35s ease, padding-block .35s ease;
  }
  header.scrolled{
    background:rgba(1,15,28,.82);
    backdrop-filter:blur(14px) saturate(140%);
    -webkit-backdrop-filter:blur(14px) saturate(140%);
    box-shadow:0 12px 30px -18px rgba(0,0,0,.7);
    border-bottom:1px solid var(--line);
    padding-block:.7rem;
  }
  .nav-row{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;}
  .logo-mark{height:38px;width:auto;flex:none;}
  nav.nav-links{display:flex;align-items:center;gap:1.9rem;}
  nav.nav-links a{
    font-size:.92rem;font-weight:500;color:var(--ink-dim);position:relative;padding-block:.3rem;
    transition:color .2s ease;
  }
  nav.nav-links a::after{
    content:"";position:absolute;inset-inline:0;bottom:-2px;height:2px;border-radius:2px;
    background:var(--grad-brand);transform:scaleX(0);transform-origin:center;transition:transform .25s ease;
  }
  nav.nav-links a:hover{color:var(--ink);}
  nav.nav-links a:hover::after{transform:scaleX(1);}
  .nav-actions{display:flex;align-items:center;gap:.8rem;}
  .menu-toggle{
    display:none;background:none;border:1px solid var(--line-strong);border-radius:10px;
    width:42px;height:42px;color:var(--ink);align-items:center;justify-content:center;cursor:pointer;
  }
  .mobile-panel{
    display:none;flex-direction:column;gap:.2rem;
    background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);
    margin-top:.8rem;padding:.6rem;
  }
  .mobile-panel.open{display:flex;}
  .mobile-panel a{padding:.75rem .9rem;border-radius:10px;color:var(--ink-dim);font-weight:500;}
  .mobile-panel a:hover{background:var(--bg-2);color:var(--ink);}

  @media (max-width:920px){
    nav.nav-links{display:none;}
    .menu-toggle{display:inline-flex;}
    .nav-actions .btn-primary.hide-mobile{display:none;}
  }

  /* ---------- sections / rhythm ---------- */
  section{position:relative;padding-block:clamp(3.5rem,7vw,6.5rem);}
  .section-alt{background:var(--bg-1);}
  .blob{
    position:absolute;border-radius:50%;filter:blur(70px);opacity:.35;pointer-events:none;z-index:0;
    background:var(--grad-brand);
  }
  @keyframes drift{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(-16px,22px) scale(1.08);}
  }
  .blob{animation:drift 16s ease-in-out infinite;}

  .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);}
  .reveal.in{opacity:1;transform:translateY(0);}
  @media (prefers-reduced-motion: reduce){ .reveal{opacity:1;transform:none;} }

  /* ---------- hero ---------- */
  .hero{padding-block:clamp(2.5rem,6vw,4rem) clamp(3.5rem,7vw,5.5rem);overflow:hidden;}
  .hero-grid{
    display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center;
    position:relative;z-index:1;
  }
  @media (max-width:960px){ .hero-grid{grid-template-columns:1fr;} }
  .hero h1{font-size:clamp(2.4rem,5vw,3.6rem);font-weight:900;line-height:1.15;}
  .hero h1 .accent{
    background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .hero p.lead{color:var(--ink-dim);font-size:1.12rem;margin-top:1.25rem;max-width:52ch;}
  .hero-ctas{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem;}
  .hero-trust{display:flex;flex-wrap:wrap;gap:1.6rem;margin-top:2.5rem;color:var(--ink-faint);font-size:.85rem;}
  .hero-trust span{display:flex;align-items:center;gap:.5rem;}
  .hero-trust svg{width:16px;height:16px;color:var(--emerald);flex:none;}

  /* hero visual: device collage */
  .hero-visual{position:relative;min-height:380px;}
  @keyframes float-y{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-10px);}
  }
  @keyframes float-y-sm{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-6px);}
  }
  .device-laptop{
    position:relative;background:linear-gradient(155deg,var(--bg-2),var(--bg-1));
    border:1px solid var(--line-strong);border-radius:20px;padding:.9rem;
    box-shadow:0 40px 70px -30px rgba(0,0,0,.7);
    animation:float-y 7s ease-in-out infinite;
    will-change:transform;
  }
  .device-topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem;}
  .device-dots{display:flex;gap:5px;}
  .device-dots span{width:8px;height:8px;border-radius:50%;background:var(--line-strong);}
  .live-pill{
    display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,77,103,.14);
    border:1px solid rgba(255,77,103,.4);color:var(--live);font-family:var(--font-display);
    font-weight:800;font-size:.68rem;padding:.22rem .55rem;border-radius:99px;
  }
  .live-pill .pulse{width:7px;height:7px;border-radius:50%;background:var(--live);animation:pulse 1.6s ease-in-out infinite;}
  @keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(255,77,103,.55);}50%{box-shadow:0 0 0 6px rgba(255,77,103,0);}}
  .device-screen{
    background:var(--bg-0);border-radius:12px;padding:.9rem;
    display:grid;grid-template-columns:1.5fr 1fr;gap:.7rem;
  }
  .tile-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;}
  .video-tile{
    aspect-ratio:4/3;border-radius:9px;position:relative;overflow:hidden;
    background:linear-gradient(160deg,var(--bg-2),#08203A);border:1px solid var(--line);
  }
  .video-tile .avatar{
    position:absolute;inset:0;margin:auto;width:46%;aspect-ratio:1;border-radius:50%;
    background:var(--grad-logo);
  }
  .video-tile .name-tag{
    position:absolute;inset-inline-start:6px;bottom:6px;font-size:.6rem;background:rgba(0,0,0,.5);
    padding:.15rem .4rem;border-radius:6px;color:var(--ink-dim);
  }
  .chat-col{background:var(--bg-1);border-radius:9px;border:1px solid var(--line);padding:.55rem;display:flex;flex-direction:column;gap:.4rem;overflow:hidden;}
  .chat-col .chat-title{font-size:.65rem;color:var(--ink-faint);font-weight:700;padding-inline-start:.2rem;}
  .chat-msg{font-size:.68rem;background:var(--bg-2);border-radius:8px;padding:.35rem .5rem;color:var(--ink-dim);}
  .chat-msg b{color:var(--emerald);font-weight:700;}
  .device-phone{
    position:absolute;bottom:-10%;inset-inline-start:-6%;width:150px;
    background:var(--bg-1);border:1px solid var(--line-strong);border-radius:22px;padding:.5rem;
    box-shadow:0 30px 50px -20px rgba(0,0,0,.75);
    animation:float-y-sm 5.5s ease-in-out infinite;
    animation-delay:.4s;
    will-change:transform;
  }
  .device-phone .screen{background:var(--bg-0);border-radius:14px;padding:.6rem;height:230px;display:flex;flex-direction:column;gap:.4rem;}
  .device-phone .app-bar{display:flex;align-items:center;gap:.35rem;}
  .device-phone .app-bar .dot{width:16px;height:16px;border-radius:6px;background:var(--grad-logo);}
  .device-phone .app-bar .line{height:6px;border-radius:4px;background:var(--bg-2);flex:1;}
  .device-phone .course-row{display:flex;gap:.4rem;align-items:center;background:var(--bg-2);border-radius:9px;padding:.4rem;}
  .device-phone .course-row .thumb{width:24px;height:24px;border-radius:6px;background:var(--grad-brand);flex:none;}
  .device-phone .course-row .l1{height:5px;width:70%;border-radius:3px;background:rgba(255,255,255,.4);margin-bottom:4px;}
  .device-phone .course-row .l2{height:4px;width:45%;border-radius:3px;background:var(--ink-faint);}

  @media (max-width:640px){ .device-phone{display:none;} }

  /* ---------- stats ---------- */
  .stats-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
    background:var(--line);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;
  }
  @media (max-width:880px){ .stats-grid{grid-template-columns:repeat(2,1fr);} }
  .stat-tile{background:var(--bg-1);padding:2rem 1.4rem;text-align:center;}
  .stat-num{
    font-family:var(--font-display);font-weight:900;font-size:clamp(2rem,4vw,2.6rem);
    color:var(--blue);font-variant-numeric:tabular-nums;line-height:1;
  }
  .stat-label{margin-top:.6rem;color:var(--ink-dim);font-size:.92rem;}

  /* ---------- generic card grids ---------- */
  .grid{display:grid;gap:1.4rem;}
  .grid-4{grid-template-columns:repeat(4,1fr);}
  .grid-3{grid-template-columns:repeat(3,1fr);}
  .grid-2{grid-template-columns:repeat(2,1fr);}
  @media (max-width:980px){ .grid-4{grid-template-columns:repeat(2,1fr);} .grid-3{grid-template-columns:repeat(2,1fr);} }
  @media (max-width:640px){ .grid-4,.grid-3,.grid-2{grid-template-columns:1fr;} }

  .card{
    --rx:0deg;--ry:0deg;
    background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);
    padding:1.7rem;transform-style:preserve-3d;perspective:800px;
    transform:translateY(0) rotateX(var(--rx)) rotateY(var(--ry));
    transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease;
  }
  .card:hover{border-color:rgba(67,203,150,.35);box-shadow:0 22px 40px -24px rgba(18,116,153,.5);}
  .card.tilting{transition:box-shadow .3s ease, border-color .3s ease;}
  .icon-badge{
    width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(155deg, rgba(67,203,150,.16), rgba(18,116,153,.1));
    border:1px solid rgba(67,203,150,.25);color:var(--emerald);flex:none;
    transition:transform .35s ease;
  }
  .icon-badge svg{width:26px;height:26px;}
  .card:hover .icon-badge{transform:scale(1.08) rotate(-4deg);}
  .card h3{font-size:1.15rem;margin-top:1.1rem;}
  .card p{color:var(--ink-dim);font-size:.95rem;margin-top:.55rem;}

  /* apps section */
  .app-card{position:relative;overflow:hidden;}
  .app-card .top-row{display:flex;align-items:center;justify-content:space-between;}
  .app-card .platforms{display:flex;gap:.5rem;margin-top:1.2rem;flex-wrap:wrap;}
  .chip{
    display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--ink-dim);
    background:var(--bg-2);border:1px solid var(--line);padding:.35rem .65rem;border-radius:9px;
  }
  .chip svg{width:15px;height:15px;flex:none;}

  /* timeline (who we are) */
  .timeline{position:relative;padding-inline-start:1.6rem;}
  .timeline::before{
    content:"";position:absolute;inset-inline-start:6px;top:6px;bottom:6px;width:2px;
    background:linear-gradient(var(--emerald),var(--teal));opacity:.5;
  }
  .timeline-item{position:relative;padding-inline-start:1.8rem;margin-bottom:2.1rem;}
  .timeline-item:last-child{margin-bottom:0;}
  .timeline-item::before{
    content:"";position:absolute;inset-inline-start:-1.4px;top:6px;width:14px;height:14px;border-radius:50%;
    background:var(--grad-brand);box-shadow:0 0 0 4px var(--bg-0);
  }
  .section-alt .timeline-item::before{box-shadow:0 0 0 4px var(--bg-1);}
  .timeline-item h3{font-size:1.1rem;}
  .timeline-item p{color:var(--ink-dim);margin-top:.4rem;font-size:.95rem;}

  .who-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
  @media (max-width:880px){ .who-grid{grid-template-columns:1fr;} }
  .who-visual{
    aspect-ratio:1/1;border-radius:26px;position:relative;overflow:hidden;
    background:linear-gradient(160deg,var(--bg-2),var(--bg-0));border:1px solid var(--line);
    display:flex;align-items:center;justify-content:center;
  }
  .who-visual .ring{
    position:absolute;border-radius:50%;border:1.5px solid rgba(67,203,150,.25);
  }
  .who-visual .ring.r1{width:78%;aspect-ratio:1;}
  .who-visual .ring.r2{width:56%;aspect-ratio:1;border-color:rgba(18,116,153,.3);}
  .who-visual .core{
    width:34%;aspect-ratio:1;border-radius:30%;background:var(--grad-logo);
    display:flex;align-items:center;justify-content:center;box-shadow:0 30px 60px -20px rgba(18,116,153,.6);
  }
  .who-visual .core svg{width:46%;height:46%;color:#fff;}

  /* live section */
  .live-layout{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(2rem,5vw,4rem);align-items:center;}
  @media (max-width:960px){ .live-layout{grid-template-columns:1fr;} }
  .live-features{display:flex;flex-direction:column;gap:1.1rem;margin-top:1.6rem;}
  .live-feature{display:flex;gap:.9rem;align-items:flex-start;}
  .live-feature .tick{
    width:28px;height:28px;border-radius:9px;background:rgba(67,203,150,.14);color:var(--emerald);
    display:flex;align-items:center;justify-content:center;flex:none;margin-top:.15rem;
  }
  .live-feature .tick svg{width:16px;height:16px;}
  .live-feature strong{display:block;color:var(--ink);}
  .live-feature span{color:var(--ink-dim);font-size:.92rem;}
  .live-demo-caption{margin-top:.8rem;text-align:center;color:var(--ink-faint);font-size:.78rem;}

  .live-card{
    background:var(--bg-1);border:1px solid var(--line-strong);border-radius:var(--radius-lg);
    padding:1.1rem;box-shadow:0 40px 80px -35px rgba(0,0,0,.75);
  }
  .live-card .head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem;}
  .live-card .viewers{display:flex;align-items:center;gap:.4rem;color:var(--ink-dim);font-size:.75rem;font-variant-numeric:tabular-nums;}
  .live-card .viewers svg{width:14px;height:14px;}
  .live-stage{
    background:var(--bg-0);border-radius:14px;padding:1rem;
    display:grid;grid-template-columns:1.4fr 1fr;gap:.9rem;
  }
  @media (max-width:520px){ .live-stage{grid-template-columns:1fr;} }
  .stage-main{
    aspect-ratio:16/10;border-radius:12px;position:relative;overflow:hidden;
    background:radial-gradient(circle at 30% 20%, rgba(67,203,150,.18), transparent 60%),
               radial-gradient(circle at 80% 80%, rgba(18,116,153,.22), transparent 55%),
               linear-gradient(160deg,var(--bg-2),#08203A);
    border:1px solid var(--line);
  }
  .stage-main .avatar-big{
    position:absolute;inset:0;margin:auto;width:36%;aspect-ratio:1;border-radius:50%;background:var(--grad-logo);
  }
  .stage-main .teacher-tag{position:absolute;inset-inline-start:10px;bottom:10px;font-size:.72rem;background:rgba(0,0,0,.5);padding:.3rem .6rem;border-radius:8px;}
  .stage-main .controls{
    position:absolute;bottom:10px;inset-inline-end:10px;display:flex;gap:.4rem;
  }
  .stage-main .controls .c{
    width:26px;height:26px;border-radius:8px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:#fff;
  }
  .stage-main .controls .c svg{width:14px;height:14px;}
  .stage-chat{background:var(--bg-1);border:1px solid var(--line);border-radius:12px;padding:.7rem;display:flex;flex-direction:column;gap:.5rem;}
  .stage-chat .msgs{display:flex;flex-direction:column;gap:.4rem;min-height:150px;}
  .chat-line{font-size:.72rem;background:var(--bg-2);border-radius:8px;padding:.4rem .55rem;color:var(--ink-dim);
    opacity:0;transform:translateY(6px);animation:chatIn .5s ease forwards;}
  .chat-line b{color:var(--emerald);}
  @keyframes chatIn{to{opacity:1;transform:translateY(0);}}
  .stage-chat .composer{display:flex;gap:.4rem;align-items:center;background:var(--bg-0);border:1px solid var(--line);border-radius:99px;padding:.4rem .6rem;}
  .stage-chat .composer span{color:var(--ink-faint);font-size:.72rem;}

  /* faq */
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-item:first-child{border-top:1px solid var(--line);}
  .faq-q{
    width:100%;background:none;border:none;color:var(--ink);font-family:var(--font-display);
    font-weight:700;font-size:1.02rem;padding:1.3rem .2rem;display:flex;align-items:center;justify-content:space-between;
    cursor:pointer;text-align:start;gap:1rem;
  }
  .faq-q .chev{width:20px;height:20px;flex:none;color:var(--emerald);transition:transform .3s ease;}
  .faq-item.open .faq-q .chev{transform:rotate(180deg);}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .35s ease;}
  .faq-a p{color:var(--ink-dim);padding:0 .2rem 1.3rem;font-size:.95rem;max-width:70ch;}

  /* contact */
  .contact-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,3.5rem);}
  @media (max-width:920px){ .contact-layout{grid-template-columns:1fr;} }
  .form-card{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(1.4rem,3vw,2.2rem);}
  .field{margin-bottom:1.1rem;}
  .field label{display:block;font-size:.85rem;color:var(--ink-dim);margin-bottom:.45rem;}
  .field input, .field textarea{
    width:100%;background:var(--bg-2);border:1px solid var(--line-strong);border-radius:12px;
    padding:.85rem 1rem;color:var(--ink);font-family:var(--font-body);font-size:.95rem;
  }
  .field input::placeholder,.field textarea::placeholder{color:var(--ink-faint);}
  .field input:focus, .field textarea:focus{outline:none;border-color:var(--emerald);}
  .field textarea{resize:vertical;min-height:110px;}

  .contact-cards{display:flex;flex-direction:column;gap:1rem;}
  .contact-card{
    background:var(--bg-1);border:1px solid var(--line);border-radius:var(--radius-md);
    padding:1.2rem 1.3rem;display:flex;align-items:center;gap:1rem;
  }
  .contact-card .icon-badge{background:rgba(18,116,153,.16);border-color:rgba(18,116,153,.3);color:var(--teal);}
  .contact-card .label{font-size:.82rem;color:var(--ink-faint);}
  .contact-card .value{font-family:var(--font-display);font-weight:700;font-size:1.02rem;margin-top:.15rem;}

  /* footer */
  footer{background:var(--bg-1);border-top:1px solid var(--line);padding-block:clamp(3rem,6vw,4.5rem) 1.6rem;position:relative;overflow:hidden;}
  .footer-top{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2rem,5vw,4rem);align-items:start;}
  @media (max-width:880px){ .footer-top{grid-template-columns:1fr;} }
  .footer-about p{color:var(--ink-dim);font-size:.95rem;max-width:52ch;margin-top:1rem;}
  .social-row{display:flex;gap:.7rem;margin-top:1.4rem;}
  .social-btn{
    width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    color:#fff;transition:transform .25s ease, filter .25s ease;
  }
  .social-btn:hover{transform:translateY(-3px);filter:brightness(1.1);}
  .social-btn svg{width:19px;height:19px;}
  .to-top{
    width:40px;height:40px;border-radius:50%;border:1px solid var(--line-strong);color:var(--emerald);
    display:flex;align-items:center;justify-content:center;margin-top:1.4rem;cursor:pointer;background:none;
    transition:background .25s ease;
  }
  .to-top:hover{background:rgba(67,203,150,.1);}
  .to-top svg{width:18px;height:18px;}
  .footer-logo-block{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem;}
  .footer-logo-block .logo-big{width:104px;height:auto;}
  .footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:1.6rem;margin-top:1.6rem;font-size:.85rem;color:var(--ink-dim);}
  .footer-links a:hover{color:var(--emerald);}
  .footer-bottom{
    border-top:1px solid var(--line);margin-top:2.6rem;padding-top:1.6rem;
    display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:center;
    text-align:center;color:var(--ink-faint);font-size:.85rem;
  }

  ::selection{background:rgba(67,203,150,.32);color:#fff;}

/* ===== Nabiga production refinements ===== */
html[dir="ltr"] body{font-family:Inter,Tajawal,"Segoe UI",Arial,sans-serif;}
html[dir="ltr"] .nav-links{direction:ltr;}
html[dir="ltr"] .hero-grid,html[dir="ltr"] .live-layout,html[dir="ltr"] .who-grid,html[dir="ltr"] .contact-layout{direction:ltr;}
html[dir="rtl"] .hero-grid,html[dir="rtl"] .live-layout,html[dir="rtl"] .who-grid,html[dir="rtl"] .contact-layout{direction:rtl;}
.nav-lang{min-width:48px;padding:.62rem .75rem;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.04);color:var(--ink);border-radius:999px;font-weight:800;font-size:.76rem;cursor:pointer;transition:.2s;}
.nav-lang:hover{background:rgba(67,203,150,.13);border-color:rgba(67,203,150,.45);transform:translateY(-1px);}
.nav-actions{display:flex;align-items:center;gap:.65rem;}
.api-toast{position:fixed;inset-inline-start:50%;bottom:24px;transform:translate(-50%,120px);z-index:80;background:rgba(5,25,44,.96);border:1px solid rgba(67,203,150,.28);box-shadow:0 18px 50px rgba(0,0,0,.35);color:#fff;padding:12px 16px;border-radius:14px;font-size:.88rem;opacity:0;transition:.28s;backdrop-filter:blur(12px)}
.api-toast.show{opacity:1;transform:translate(-50%,0)}
.modal{position:fixed;inset:0;background:rgba(1,15,28,.72);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;padding:20px;z-index:70;}
.modal.open{display:flex;}
.modal-panel{width:min(680px,100%);background:linear-gradient(145deg,#0b2740,#05192c);border:1px solid rgba(255,255,255,.1);border-radius:26px;box-shadow:0 35px 90px rgba(0,0,0,.5);padding:28px;position:relative;}
.modal-close{position:absolute;top:16px;inset-inline-end:16px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);color:#fff;cursor:pointer;font-size:1.2rem;}
.download-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px}
.download-option{display:flex;align-items:center;gap:12px;padding:16px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);transition:.2s;color:#fff;text-decoration:none}
.download-option:hover{border-color:rgba(67,203,150,.45);background:rgba(67,203,150,.08);transform:translateY(-2px)}
.download-option .mini-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,var(--emerald),var(--teal));color:#04131e;font-weight:900;}
.download-option small{display:block;color:var(--ink-faint);font-size:.68rem;margin-bottom:2px}.download-option strong{font-size:.9rem}
@media(max-width:640px){.download-grid{grid-template-columns:1fr}.nav-lang{min-width:44px}.modal-panel{padding:22px;border-radius:20px}}
