:root{
      --bg:#061a22;
      --bg-deep:#081f29;
      --bg-soft:#0c3440;
      --panel:#0f2e39;
      --panel-2:#102b35;
      --glass:rgba(255,255,255,.08);
      --glass-2:rgba(255,255,255,.05);
      --line:rgba(229,222,192,.12);
      --line-strong:rgba(229,222,192,.22);
      --text:#ffffff;
      --soft:#efe6cb;
      --muted:rgba(239,230,203,.78);
      --muted-2:rgba(239,230,203,.60);
      --brand:#1E7C55;
      --teal:#157B7D;
      --orange:#E28C1C;
      --orange-soft:#ffd79f;
      --mint:#A7F0D7;
      --cyan:#8DDDE1;
      --shadow-xl:0 34px 90px rgba(0,0,0,.34);
      --shadow-lg:0 20px 50px rgba(0,0,0,.26);
      --shadow-md:0 12px 24px rgba(0,0,0,.18);
      --radius-xl:36px;
      --radius-lg:26px;
      --radius-md:18px;
      --container:1240px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:"Noto Sans Arabic",system-ui,-apple-system,"Segoe UI",sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at 0% 0%, rgba(141,221,225,.12), transparent 22%),
        radial-gradient(circle at 100% 0%, rgba(226,140,28,.14), transparent 18%),
        radial-gradient(circle at 72% 88%, rgba(30,124,85,.13), transparent 24%),
        linear-gradient(180deg,#061a22 0%,#0b2630 40%,#0d3340 100%);
      line-height:1.8;
      overflow-x:hidden;
    }
    body::before{
      content:"";
      position:fixed;inset:0;pointer-events:none;z-index:-1;
      background-image:
        linear-gradient(rgba(255,255,255,.015) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.015) 1px, transparent 1px);
      background-size:64px 64px;
      mask-image:linear-gradient(180deg, rgba(0,0,0,.75), transparent 95%);
    }
    a{text-decoration:none;color:inherit}
    .skip-link{position:absolute;right:16px;top:-48px;padding:12px 16px;border-radius:14px;background:#fff;color:#102833;font-weight:800;z-index:200;transition:top .2s ease}
    .skip-link:focus{top:16px}
    :focus-visible{outline:3px solid rgba(255,215,159,.9);outline-offset:3px}
    .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
    img{display:block;max-width:100%}
    button,input{font:inherit}
    .container{width:min(calc(100% - 32px),var(--container));margin-inline:auto}
    .section{padding:110px 0;position:relative}
    .section-tight{padding:84px 0}
    .section-divider{border-top:1px solid rgba(239,230,203,.06)}
    .glass{background:linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.05));border:1px solid var(--line);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:var(--shadow-lg)}
    .solid{background:linear-gradient(180deg, rgba(12,39,48,.94), rgba(10,33,41,.98));border:1px solid rgba(239,230,203,.08);box-shadow:var(--shadow-lg)}
    .warm{background:linear-gradient(135deg, rgba(226,140,28,.20), rgba(255,227,177,.08));border:1px solid rgba(255,215,159,.24)}
    .cool{background:linear-gradient(135deg, rgba(21,123,125,.26), rgba(141,221,225,.08));border:1px solid rgba(141,221,225,.18)}
    .title{margin:0 0 14px;font-size:clamp(2.1rem,1.65rem + 1.6vw,3.6rem);line-height:1.15;letter-spacing:-.03em}
    .lead{margin:0;color:var(--muted);font-size:1.05rem;max-width:760px}
    .eyebrow{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(239,230,203,.12);font-weight:800;color:var(--soft);margin-bottom:20px}
    .eyebrow .dot{width:10px;height:10px;border-radius:999px;background:linear-gradient(135deg,var(--orange),#f5ba5b);box-shadow:0 0 0 6px rgba(226,140,28,.12)}
    .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:16px 22px;border-radius:18px;border:1px solid transparent;font-weight:800;transition:.24s ease;cursor:pointer;box-shadow:var(--shadow-md)}
    .btn:hover{transform:translateY(-2px)}
    .btn-primary{background:linear-gradient(135deg,var(--orange),#f1ac41);color:#102833}
    .btn-secondary{background:linear-gradient(135deg,var(--brand),#24986a);color:#fff}
    .btn-ghost{background:rgba(255,255,255,.06);border-color:rgba(239,230,203,.12);color:var(--soft)}
    .site-header{position:sticky;top:0;z-index:100;padding:16px 0;background:linear-gradient(180deg, rgba(6,26,34,.88), rgba(6,26,34,.55));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(239,230,203,.06)}
    .nav{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 18px;border-radius:24px}
    .brand{display:flex;align-items:center;gap:14px;min-width:0}
    .brand-logo{width:60px;height:60px;border-radius:18px;overflow:hidden;border:1px solid rgba(239,230,203,.14);background:rgba(255,255,255,.04);box-shadow:var(--shadow-md)}
    .brand-logo img{width:100%;height:100%;object-fit:cover}
    .brand-title{font-size:1.08rem;font-weight:900;line-height:1.15}
    .brand-sub{font-size:.86rem;color:var(--soft)}
    .nav-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
    .nav-links a{padding:12px 14px;border-radius:14px;color:var(--soft);font-weight:700;transition:.2s ease}
    .nav-links a:hover{background:rgba(255,255,255,.06);color:#fff}
    .menu-btn{display:none;width:48px;height:48px;border:none;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(239,230,203,.12);color:#fff;cursor:pointer}

    .hero{padding:56px 0 36px;position:relative}
    .orb,.orb-2,.orb-3{position:absolute;border-radius:999px;filter:blur(72px);pointer-events:none}
    .orb{width:260px;height:260px;right:-80px;top:20px;background:rgba(226,140,28,.16)}
    .orb-2{width:220px;height:220px;left:-70px;bottom:120px;background:rgba(21,123,125,.18)}
    .orb-3{width:280px;height:280px;right:24%;bottom:-100px;background:rgba(30,124,85,.14)}
    .hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:28px;position:relative;z-index:1}
    .hero-copy,.hero-side{padding:34px;border-radius:var(--radius-xl);position:relative;overflow:hidden}
    .hero-copy::after{content:"";position:absolute;inset:auto -15% -25% auto;width:260px;height:260px;border-radius:999px;background:radial-gradient(circle, rgba(226,140,28,.24), transparent 62%);pointer-events:none}
    .hero h1{margin:0 0 16px;font-size:clamp(2.6rem,2rem + 2.4vw,4.8rem);line-height:1.06;letter-spacing:-.04em;max-width:760px}
    .hero p{margin:0 0 28px;color:var(--muted);font-size:1.08rem;max-width:700px}
    .actions{display:flex;gap:12px;flex-wrap:wrap}
    .hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:26px}
    .stat{padding:16px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(239,230,203,.10)}
    .stat strong{display:block;font-size:1.24rem;margin-bottom:4px;color:#fff}
    .stat span{color:var(--muted);font-size:.92rem}
    .mini-proof{margin-top:18px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:var(--soft);font-weight:700}
    .mini-proof .pill{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(239,230,203,.12)}
    .hero-side{display:flex;flex-direction:column;gap:16px;background:linear-gradient(180deg, rgba(13,41,50,.95), rgba(9,31,39,.98));border:1px solid rgba(239,230,203,.10);box-shadow:var(--shadow-xl)}
    .hero-panel{padding:22px;border-radius:24px}
    .hero-panel h3{margin:0 0 8px;font-size:1.14rem}
    .hero-panel p{margin:0;color:var(--muted);font-size:.96rem}
    .signal-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
    .signal{padding:18px;border-radius:20px;background:rgba(255,255,255,.045);border:1px solid rgba(239,230,203,.10)}
    .signal small{display:block;color:var(--soft);margin-bottom:6px}
    .signal strong{font-size:1.02rem;line-height:1.5}
    .dashboard{padding:20px;border-radius:26px;background:linear-gradient(180deg, rgba(8,26,33,.94), rgba(9,31,40,.94));border:1px solid rgba(239,230,203,.10)}
    .dash-top{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:18px}
    .legend{display:flex;gap:12px;flex-wrap:wrap;color:var(--soft);font-size:.9rem}
    .legend span{display:inline-flex;align-items:center;gap:8px}
    .sw{width:10px;height:10px;border-radius:999px;display:inline-block}
    .chart-bars{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;align-items:end;height:170px}
    .bar{border-radius:14px 14px 6px 6px;background:linear-gradient(180deg, rgba(141,221,225,.95), rgba(21,123,125,.95));position:relative;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
    .bar::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:-12px;width:2px;height:12px;background:rgba(255,215,159,.8)}
    .bar.warmbar{background:linear-gradient(180deg, rgba(255,203,126,.95), rgba(226,140,28,.96))}
    .chart-labels{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;margin-top:14px;color:var(--muted-2);font-size:.84rem;text-align:center}
    .trust-row{margin-top:26px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
    .trust-card{padding:18px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(239,230,203,.10);display:flex;gap:12px;align-items:flex-start}
    .trust-icon{width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg, rgba(30,124,85,.34), rgba(141,221,225,.18));border:1px solid rgba(239,230,203,.12);font-weight:900;color:#fff;flex:0 0 auto}
    .trust-card b{display:block;margin-bottom:4px}
    .trust-card span{color:var(--muted);font-size:.92rem}

    .bento{display:grid;grid-template-columns:1.1fr .9fr;gap:24px}
    .card{padding:32px;border-radius:var(--radius-xl);position:relative;overflow:hidden}
    .list{display:grid;gap:14px;margin-top:24px}
    .list-item{display:flex;gap:14px;align-items:flex-start;padding:18px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(239,230,203,.10)}
    .list-item i{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg, rgba(226,140,28,.22), rgba(255,215,159,.08));border:1px solid rgba(255,215,159,.16);font-style:normal;font-weight:900;flex:0 0 auto}
    .list-item h4{margin:0 0 4px;font-size:1.02rem}
    .list-item p{margin:0;color:var(--muted);font-size:.96rem}
    .proof-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}
    .proof-card{padding:22px;border-radius:22px}
    .proof-card b{display:block;margin-bottom:8px;font-size:1.02rem}
    .proof-card span{color:var(--muted);font-size:.95rem}

    .feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
    .feature{padding:26px;border-radius:28px;background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));border:1px solid rgba(239,230,203,.10);box-shadow:var(--shadow-md);position:relative}
    .feature::before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:3px;background:linear-gradient(90deg,var(--orange),var(--brand),var(--teal));opacity:.9}
    .feature .icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;margin-bottom:18px;font-weight:900;background:linear-gradient(135deg, rgba(30,124,85,.28), rgba(226,140,28,.16));border:1px solid rgba(239,230,203,.12)}
    .feature h3{margin:0 0 10px;font-size:1.22rem}
    .feature p{margin:0;color:var(--muted);font-size:.97rem}

    .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:30px}
    .step{padding:26px;border-radius:28px;background:linear-gradient(180deg, rgba(13,41,50,.96), rgba(8,29,37,.96));border:1px solid rgba(239,230,203,.09);position:relative;overflow:hidden}
    .step::after{content:"";position:absolute;inset:auto -10% -40% auto;width:180px;height:180px;border-radius:999px;background:radial-gradient(circle, rgba(226,140,28,.18), transparent 65%)}
    .step-no{display:inline-flex;padding:8px 12px;border-radius:999px;background:rgba(255,215,159,.12);border:1px solid rgba(255,215,159,.20);color:var(--orange-soft);font-weight:900;margin-bottom:14px}
    .step h3{margin:0 0 8px;font-size:1.12rem}
    .step p{margin:0;color:var(--muted);font-size:.96rem}

    .metrics-wrap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:28px}
    .metric{padding:24px;border-radius:24px;text-align:center}
    .metric strong{display:block;font-size:2rem;line-height:1;margin-bottom:10px;color:#fff}
    .metric span{color:var(--muted);font-size:.94rem}

    .compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:28px}
    .compare{padding:26px;border-radius:28px}
    .compare h3{margin:0 0 14px;font-size:1.16rem}
    .compare ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
    .compare li{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(239,230,203,.09);color:var(--muted)}

    .cta-shell{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;padding:32px;border-radius:var(--radius-xl)}
    .cta-box{padding:24px;border-radius:26px;background:rgba(6,26,34,.35);border:1px solid rgba(239,230,203,.10)}
    .cta-box h3{margin:0 0 8px;font-size:1.18rem}
    .cta-box p{margin:0 0 18px;color:var(--muted);font-size:.96rem}

    .faq-list{display:grid;gap:14px;margin-top:28px}
    .faq{border-radius:22px;overflow:hidden;background:rgba(255,255,255,.05);border:1px solid rgba(239,230,203,.10)}
    .faq-q{width:100%;text-align:right;background:none;border:none;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#fff;font-weight:800;cursor:pointer}
    .faq-ind{width:34px;height:34px;border-radius:999px;display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(239,230,203,.12);transition:.2s ease;color:var(--soft)}
    .faq.open .faq-ind{transform:rotate(45deg);background:rgba(226,140,28,.14);color:var(--orange-soft)}
    .faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .24s ease}
    .faq-a > div{overflow:hidden}
    .faq.open .faq-a{grid-template-rows:1fr}
    .faq-a p{margin:0;padding:0 22px 20px;color:var(--muted)}

    .legal-grid,.contact-grid{display:grid;gap:20px;margin-top:28px}
    .legal-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    .legal-card,.contact-card{padding:24px;border-radius:26px;background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.04));border:1px solid rgba(239,230,203,.10)}
    .legal-card h3,.contact-card h3{margin:0 0 10px;font-size:1.1rem}
    .legal-card p,.contact-card p{margin:0;color:var(--muted)}
    .mini-link{margin-top:16px;display:inline-flex;align-items:center;gap:8px;color:var(--soft);font-weight:800}
    .contact-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
    .contact-head{display:flex;gap:12px;align-items:center;margin-bottom:14px}
    .contact-icon{width:50px;height:50px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg, rgba(30,124,85,.28), rgba(141,221,225,.14));border:1px solid rgba(239,230,203,.12)}
    .contact-btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 16px;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(239,230,203,.12);font-weight:800;color:var(--soft);margin-top:16px}
    .contact-btn:hover{background:rgba(255,255,255,.11);color:#fff}

    .footer{padding:38px 0 46px;border-top:1px solid rgba(239,230,203,.08)}
    .footer-grid{display:grid;grid-template-columns:1.3fr .8fr .8fr .9fr;gap:24px}
    .footer-brand{display:flex;flex-direction:column;gap:14px}
    .footer-brand-top{display:flex;gap:14px;align-items:center}
    .footer-logo{width:58px;height:58px;border-radius:18px;overflow:hidden;border:1px solid rgba(239,230,203,.14)}
    .footer-logo img{width:100%;height:100%;object-fit:cover}
    .footer-title{font-size:1.1rem;font-weight:900}
    .footer-copy,.footer-col a,.footer-col p{color:var(--muted);font-size:.95rem}
    .footer-col h4{margin:0 0 12px;font-size:1rem}
    .footer-links{display:grid;gap:10px}
    .footer-links a:hover{color:#fff}
    .footer-bottom{margin-top:28px;padding-top:18px;border-top:1px solid rgba(239,230,203,.08);display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;color:var(--muted-2);font-size:.92rem}
    .sticky-mobile{
      position: fixed;
      left: 50%;
      transform: translateX(-50%);
      bottom: 10px;
      z-index: 999;
      display: none;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      padding: 8px;
      width: min(calc(100vw - 16px), 560px);
      border-radius: 18px;
      background: rgba(8,30,38,.96);
      border: 1px solid rgba(239,230,203,.12);
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      box-shadow: 0 20px 40px rgba(0,0,0,.28);
      box-sizing: border-box;
      overflow: hidden;
    }
    
    .sticky-mobile a{
      min-height: 48px;
      min-width: 0;
      padding: 0 10px;
      border-radius: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 800;
      font-size: 16px;
      text-align: center;
      white-space: nowrap;
      box-sizing: border-box;
    }
    
    .sticky-mobile .primary{
      background: linear-gradient(135deg,var(--orange),#f1ac41);
      color: #102833;
    }
    
    .sticky-mobile .secondary{
      background: linear-gradient(135deg,var(--brand),#24986a);
      color: #fff;
    }
    
    @media (max-width:1080px){
      .hero-grid,.bento,.cta-shell,.compare-grid{grid-template-columns:1fr}
      .feature-grid,.steps,.legal-grid{grid-template-columns:1fr}
      .metrics-wrap{grid-template-columns:repeat(2,minmax(0,1fr))}
      .contact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
      .trust-row{grid-template-columns:1fr 1fr}
      .footer-grid{grid-template-columns:1fr 1fr}
    }
    
    @media (max-width:820px){
      .site-header{padding:12px 0}
      .nav{padding:14px;gap:14px;flex-wrap:wrap}
      .menu-btn{display:inline-grid;place-items:center}
      .nav-links{display:none;width:100%;flex-direction:column;align-items:stretch;padding-top:6px}
      .nav-links.show{display:flex}
      .nav-links a{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(239,230,203,.10)}
      .hero-copy,.hero-side,.card{padding:24px}
      .hero-stats,.signal-grid,.chart-bars,.chart-labels{gap:10px}
      .trust-row,.metrics-wrap{grid-template-columns:1fr}
      .footer-grid{grid-template-columns:1fr}
      .sticky-mobile{display:grid}
      body{padding-bottom:82px}
    }
    
    @media (max-width:640px){
      .container{width:min(calc(100% - 22px),var(--container))}
      .section{padding:82px 0}
      .title{font-size:clamp(1.9rem,1.45rem + 2vw,2.7rem)}
      .hero h1{font-size:clamp(2.15rem,1.85rem + 1.7vw,3rem)}
      .hero-stats,.signal-grid,.contact-grid{grid-template-columns:1fr}
      .actions .btn{width:100%}
      .chart-bars{height:130px}
    }
    
    @media (max-width:480px){
      .sticky-mobile{
        bottom: 8px;
        gap: 8px;
        padding: 8px;
        width: min(calc(100vw - 12px), 520px);
        border-radius: 16px;
      }
    
      .sticky-mobile a{
        min-height: 46px;
        font-size: 15px;
        padding: 0 8px;
        border-radius: 12px;
      }
    
      body{padding-bottom:78px}
    }
    html{
      overflow-x: hidden;
    }
    
    body{
      overflow-x: hidden;
    }