/* =====================================================
   Rasid Hostinger-inspired redesign
   2026-07-02
   Clean light landing, purple CTAs, soft cards, responsive.
   Inspired by modern web-hosting SaaS layouts without copying brand assets.
===================================================== */
:root{
  --rs-host-bg:#f5f3ff;
  --rs-host-bg2:#eef2ff;
  --rs-host-paper:#ffffff;
  --rs-host-ink:#1f1346;
  --rs-host-muted:#5f5a78;
  --rs-host-purple:#673de6;
  --rs-host-purple-dark:#2f1c6a;
  --rs-host-purple-soft:#ebe4ff;
  --rs-host-green:#00b67a;
  --rs-host-line:#ddd6fe;
  --rs-host-shadow:0 18px 50px rgba(47,28,106,.10);
  --rs-host-shadow-strong:0 26px 80px rgba(47,28,106,.16);
}
html{scroll-behavior:smooth!important;}
body{
  background:var(--rs-host-bg)!important;
  color:var(--rs-host-ink)!important;
  font-family:Tajawal,Arial,Tahoma,sans-serif!important;
}
body:before{display:none!important;content:none!important;}
a{transition:all .2s ease!important;}
.wrap,
.rdx-gh-page .wrap{
  width:min(1208px,calc(100% - 48px))!important;
  max-width:1208px!important;
}
.header{
  background:rgba(255,255,255,.92)!important;
  border-bottom:1px solid rgba(103,61,230,.12)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:0 12px 35px rgba(47,28,106,.07)!important;
}
.header .wrap.nav{
  min-height:76px!important;
  grid-template-columns:minmax(250px,auto) minmax(0,1fr) auto!important;
}
.header .brand,
.header .brand:visited{text-decoration:none!important;color:var(--rs-host-purple-dark)!important;}
.header .logo{
  background:var(--rs-host-purple-soft)!important;
  border:1px solid rgba(103,61,230,.18)!important;
  border-radius:18px!important;
  box-shadow:0 14px 28px rgba(103,61,230,.12)!important;
}
.header .brand-title{
  color:var(--rs-host-purple-dark)!important;
  font-weight:950!important;
}
.header .brand small{color:var(--rs-host-muted)!important;font-weight:800!important;}
.header .links a{
  color:var(--rs-host-purple-dark)!important;
  background:transparent!important;
  border:1px solid transparent!important;
  font-weight:900!important;
}
.header .links a:hover{
  background:var(--rs-host-purple-soft)!important;
  border-color:rgba(103,61,230,.16)!important;
  color:var(--rs-host-purple)!important;
  transform:translateY(-1px)!important;
}
.header .links a.nav-new-link{
  color:var(--rs-host-purple)!important;
  background:#fff!important;
  border-color:rgba(103,61,230,.22)!important;
  box-shadow:0 8px 22px rgba(103,61,230,.08)!important;
}
.header .links a.nav-new-link::after,
.nav-new-link::after{
  background:#ffda2a!important;
  color:#2f1c6a!important;
  border-color:rgba(47,28,106,.14)!important;
  box-shadow:0 12px 28px rgba(255,218,42,.35)!important;
}
.header .actions .btn,
.header .actions .lang,
.header .actions button,
.btn,
button.btn,
a.btn{
  border-radius:999px!important;
  font-weight:950!important;
  box-shadow:none!important;
}
.header .actions .btn:not(.secondary),
.btn:not(.secondary),
a.btn:not(.secondary){
  background:var(--rs-host-purple)!important;
  border-color:var(--rs-host-purple)!important;
  color:#fff!important;
}
.header .actions .btn.secondary,
.header .actions .lang,
.header .actions button,
.btn.secondary,
a.btn.secondary{
  background:#fff!important;
  border:1px solid rgba(103,61,230,.22)!important;
  color:var(--rs-host-purple-dark)!important;
}
.header .actions .btn:hover,
.header .actions .lang:hover,
.header .actions button:hover,
.btn:hover,
a.btn:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 12px 28px rgba(103,61,230,.14)!important;
}
.auth-chip{
  background:var(--rs-host-purple-soft)!important;
  color:var(--rs-host-purple-dark)!important;
  border:1px solid rgba(103,61,230,.16)!important;
  border-radius:999px!important;
  font-weight:900!important;
}
.rdx-home{
  background:
    radial-gradient(circle at 8% 3%,rgba(103,61,230,.15),transparent 29%),
    radial-gradient(circle at 86% 0%,rgba(0,182,122,.10),transparent 27%),
    linear-gradient(180deg,#ffffff 0%,#f8f7ff 33%,#f5f3ff 100%)!important;
  color:var(--rs-host-ink)!important;
}
.rdx-hero{
  padding:82px 0 74px!important;
  border-bottom:1px solid rgba(103,61,230,.12)!important;
  overflow:hidden!important;
  background:transparent!important;
}
.rdx-hero:before{
  inset:0!important;
  background-image:
    linear-gradient(rgba(103,61,230,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(103,61,230,.045) 1px,transparent 1px)!important;
  background-size:54px 54px!important;
  mask-image:linear-gradient(to bottom,#000,transparent 86%)!important;
}
.rdx-hero-grid{grid-template-columns:minmax(0,1fr) minmax(360px,470px)!important;gap:58px!important;}
.rdx-hero-copy{position:relative!important;z-index:2!important;}
.rdx-kicker{
  background:var(--rs-host-purple-soft)!important;
  color:var(--rs-host-purple)!important;
  border:1px solid rgba(103,61,230,.18)!important;
  padding:9px 16px!important;
  box-shadow:0 10px 28px rgba(103,61,230,.08)!important;
}
.rdx-hero h1{
  color:var(--rs-host-purple-dark)!important;
  font-size:clamp(44px,5.5vw,74px)!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
  margin:20px 0 18px!important;
  max-width:790px!important;
}
.rdx-hero h1::first-line{color:var(--rs-host-purple-dark)!important;}
.rdx-hero p{
  color:var(--rs-host-muted)!important;
  font-size:clamp(17px,1.4vw,21px)!important;
  line-height:1.9!important;
  max-width:720px!important;
  font-weight:600!important;
}
.rdx-hero-actions{gap:14px!important;margin-top:32px!important;}
.rdx-btn{
  min-height:56px!important;
  border-radius:999px!important;
  padding:14px 28px!important;
  font-size:16px!important;
}
.rdx-btn-primary,
.rdx-service-card a,
.rdx-price-grid a{
  background:var(--rs-host-purple)!important;
  border-color:var(--rs-host-purple)!important;
  color:#fff!important;
  box-shadow:0 16px 34px rgba(103,61,230,.23)!important;
}
.rdx-btn-primary:hover,
.rdx-service-card a:hover,
.rdx-price-grid a:hover{
  background:#5025d1!important;
  border-color:#5025d1!important;
  transform:translateY(-2px)!important;
  box-shadow:0 22px 44px rgba(103,61,230,.27)!important;
}
.rdx-btn-ghost{
  background:#fff!important;
  color:var(--rs-host-purple-dark)!important;
  border-color:rgba(103,61,230,.22)!important;
  box-shadow:0 12px 28px rgba(47,28,106,.07)!important;
}
.rdx-trust-row{gap:10px!important;margin-top:26px!important;}
.rdx-trust-row span{
  background:#fff!important;
  color:var(--rs-host-purple-dark)!important;
  border:1px solid rgba(103,61,230,.16)!important;
  box-shadow:0 8px 22px rgba(47,28,106,.06)!important;
}
.rdx-hero-visual{min-height:455px!important;}
.rdx-phone-card{
  width:min(390px,88vw)!important;
  background:linear-gradient(180deg,#fff,#faf9ff)!important;
  border:1px solid rgba(103,61,230,.18)!important;
  border-radius:34px!important;
  box-shadow:0 34px 90px rgba(47,28,106,.18)!important;
  padding:24px!important;
  transform:rotate(-2.5deg)!important;
  color:var(--rs-host-purple-dark)!important;
}
.rdx-phone-card:before{
  content:""!important;
  position:absolute!important;
  inset:16px!important;
  border-radius:26px!important;
  border:1px solid rgba(103,61,230,.08)!important;
  pointer-events:none!important;
}
.rdx-phone-top span{background:#d8d0ff!important;}
.rdx-phone-head{border-bottom:1px solid rgba(103,61,230,.14)!important;}
.rdx-phone-head strong{color:var(--rs-host-purple-dark)!important;}
.rdx-phone-head small{color:var(--rs-host-purple)!important;}
.rdx-metric{
  background:linear-gradient(135deg,var(--rs-host-purple),#8b5cf6)!important;
  color:#fff!important;
  border-radius:24px!important;
  box-shadow:0 20px 44px rgba(103,61,230,.22)!important;
}
.rdx-metric b,.rdx-metric span{color:#fff!important;}
.rdx-task{
  background:#fff!important;
  color:var(--rs-host-purple-dark)!important;
  border:1px solid rgba(103,61,230,.14)!important;
  box-shadow:0 10px 24px rgba(47,28,106,.06)!important;
}
.rdx-task em{color:var(--rs-host-purple)!important;font-weight:950!important;}
.rdx-float{
  background:#fff!important;
  border:1px solid rgba(103,61,230,.18)!important;
  color:var(--rs-host-purple-dark)!important;
  box-shadow:var(--rs-host-shadow)!important;
}
.rdx-float-a{right:0!important;top:56px!important;}
.rdx-float-b{left:0!important;bottom:70px!important;}
.rdx-section{
  padding:78px 0!important;
  border-bottom:1px solid rgba(103,61,230,.12)!important;
  background:transparent!important;
}
.rdx-section-head{margin-bottom:34px!important;}
.rdx-section-head span{
  display:inline-flex!important;
  color:var(--rs-host-purple)!important;
  background:var(--rs-host-purple-soft)!important;
  border:1px solid rgba(103,61,230,.16)!important;
  border-radius:999px!important;
  padding:7px 14px!important;
  font-weight:950!important;
}
#services .rdx-section-head > span,
#packages .rdx-section-head > span,
#automation .rdx-section-head > span{display:inline-flex!important;}
.rdx-section-head h2,
#services .rdx-section-head h2{
  color:var(--rs-host-purple-dark)!important;
  font-size:clamp(32px,3.4vw,52px)!important;
  line-height:1.18!important;
  margin:14px 0 10px!important;
}
.rdx-section-head p{
  color:var(--rs-host-muted)!important;
  font-size:17px!important;
  line-height:1.8!important;
  font-weight:600!important;
}
.rdx-service-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:18px!important;
}
.rdx-service-card{
  background:#fff!important;
  border:1px solid rgba(103,61,230,.14)!important;
  border-radius:24px!important;
  box-shadow:var(--rs-host-shadow)!important;
  padding:88px 24px 24px!important;
  min-height:360px!important;
  overflow:hidden!important;
}
.rdx-service-card:hover{
  transform:translateY(-4px)!important;
  box-shadow:var(--rs-host-shadow-strong)!important;
  border-color:rgba(103,61,230,.26)!important;
}
.rdx-service-card:before{
  height:170px!important;
  inset:auto -20% -72px -20%!important;
  background:radial-gradient(circle,rgba(103,61,230,.13),transparent 62%)!important;
}
.rdx-service-card.whatsapp:before{background:radial-gradient(circle,rgba(0,182,122,.16),transparent 62%)!important;}
.rdx-service-card.green:before{background:radial-gradient(circle,rgba(0,182,122,.11),transparent 62%)!important;}
.rdx-service-card.purple:before{background:radial-gradient(circle,rgba(103,61,230,.13),transparent 62%)!important;}
.rdx-service-card .rdx-icon{
  position:absolute!important;
  inset-block-start:24px!important;
  inset-inline-end:24px!important;
  width:52px!important;
  height:52px!important;
  border-radius:18px!important;
  background:var(--rs-host-purple-soft)!important;
  border:1px solid rgba(103,61,230,.16)!important;
  box-shadow:none!important;
}
.rdx-service-card .rdx-icon:before{background:var(--rs-host-purple)!important;}
.rdx-service-card.blue .rdx-icon,
.rdx-service-card .rdx-icon.rdx-icon-bot{
  background:#229ED9!important;
  border-color:rgba(34,158,217,.42)!important;
  box-shadow:0 12px 28px rgba(34,158,217,.16)!important;
}
.rdx-service-card.blue .rdx-icon:before,
.rdx-service-card .rdx-icon.rdx-icon-bot:before{background:#fff!important;}
.rdx-service-card.whatsapp .rdx-icon{
  background:#25D366!important;
  border-color:rgba(37,211,102,.42)!important;
  box-shadow:0 12px 28px rgba(37,211,102,.16)!important;
}
.rdx-service-card.whatsapp .rdx-icon:before{background:#fff!important;}
.rdx-service-card h3{
  color:var(--rs-host-purple-dark)!important;
  font-size:22px!important;
  line-height:1.35!important;
  padding-inline-end:58px!important;
}
.rdx-service-card p{
  color:var(--rs-host-muted)!important;
  line-height:1.8!important;
  font-weight:600!important;
}
.rdx-service-card ul{gap:9px!important;}
.rdx-service-card li{
  color:var(--rs-host-purple-dark)!important;
  font-weight:850!important;
}
.rdx-service-card li:before{
  content:"✓"!important;
  color:var(--rs-host-green)!important;
  font-weight:950!important;
}
.rdx-service-card a{
  min-height:46px!important;
  border-radius:999px!important;
  padding:11px 19px!important;
}
.rdx-packages{
  background:linear-gradient(180deg,rgba(235,228,255,.55),rgba(255,255,255,.4))!important;
}
.rdx-package-group{
  margin-top:30px!important;
  padding:26px!important;
  border-radius:30px!important;
  background:rgba(255,255,255,.62)!important;
  border:1px solid rgba(103,61,230,.12)!important;
  box-shadow:0 18px 55px rgba(47,28,106,.07)!important;
}
.rdx-package-group>h3{
  color:var(--rs-host-purple-dark)!important;
  font-size:24px!important;
  margin:0 0 18px!important;
}
.rdx-price-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
.rdx-price-grid article{
  background:#fff!important;
  border:1px solid rgba(103,61,230,.16)!important;
  border-radius:24px!important;
  min-height:300px!important;
  padding:28px 24px 24px!important;
  box-shadow:0 14px 42px rgba(47,28,106,.08)!important;
  display:flex!important;
  flex-direction:column!important;
}
.rdx-price-grid article:hover{
  transform:translateY(-3px)!important;
  box-shadow:var(--rs-host-shadow-strong)!important;
}
.rdx-price-grid article.hot{
  border:2px solid var(--rs-host-purple)!important;
  box-shadow:0 22px 70px rgba(103,61,230,.16)!important;
}
.rdx-price-grid article.hot:before{
  content:"الأكثر طلباً"!important;
  position:absolute!important;
  inset-inline:18px!important;
  top:-14px!important;
  min-height:30px!important;
  border-radius:999px!important;
  background:var(--rs-host-purple)!important;
  color:#fff!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:12px!important;
  font-weight:950!important;
  box-shadow:0 14px 32px rgba(103,61,230,.22)!important;
  z-index:2!important;
}
body[data-lang="en"] .rdx-price-grid article.hot:before{content:"Most popular"!important;}
.rdx-price-grid article.hot > small{display:none!important;}
.rdx-price-grid article > span{
  color:var(--rs-host-purple)!important;
  font-size:14px!important;
  font-weight:950!important;
  display:inline-flex!important;
  background:transparent!important;
  border:0!important;
  padding:0!important;
}
.rdx-price-grid h4.rdx-price-sar{
  margin:20px 0 16px!important;
  gap:9px!important;
  color:var(--rs-host-purple-dark)!important;
  align-items:center!important;
}
.rdx-price-grid h4.rdx-price-sar span{
  color:var(--rs-host-muted)!important;
  font-size:16px!important;
  font-weight:900!important;
}
.rdx-price-grid h4.rdx-price-sar b{
  color:var(--rs-host-purple-dark)!important;
  font-size:44px!important;
  letter-spacing:-.03em!important;
}
.rdx-price-grid h4.rdx-price-sar img{
  width:31px!important;
  height:31px!important;
  min-width:31px!important;
  filter:none!important;
  opacity:.88!important;
}
.rdx-price-grid p{
  color:var(--rs-host-muted)!important;
  line-height:1.75!important;
  font-weight:600!important;
  min-height:105px!important;
  margin-bottom:22px!important;
}
.rdx-price-grid p:before{
  content:"✓"!important;
  color:var(--rs-host-green)!important;
  font-weight:950!important;
  margin-inline-end:8px!important;
}
.rdx-price-grid a{
  width:100%!important;
  min-height:48px!important;
  border-radius:999px!important;
  margin-top:auto!important;
}
.rdx-process-section{
  background:#fff!important;
}
.rdx-process-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:18px!important;
}
.rdx-process-grid article{
  background:#fff!important;
  border:1px solid rgba(103,61,230,.14)!important;
  border-radius:24px!important;
  box-shadow:var(--rs-host-shadow)!important;
  padding:24px!important;
}
.rdx-process-grid b{
  background:var(--rs-host-purple-soft)!important;
  color:var(--rs-host-purple)!important;
  border-radius:16px!important;
}
.rdx-process-grid h3{color:var(--rs-host-purple-dark)!important;}
.rdx-process-grid p{color:var(--rs-host-muted)!important;font-weight:600!important;}
.site-footer{
  background:var(--rs-host-purple-dark)!important;
  color:#fff!important;
  border-top:0!important;
  padding-top:54px!important;
}
.site-footer p,
.site-footer .muted,
.footer-bottom-line,
.footer-payments-block p{color:rgba(255,255,255,.74)!important;}
.site-footer h3{color:#fff!important;}
.footer-important a{
  color:rgba(255,255,255,.82)!important;
  background:transparent!important;
  border-color:rgba(255,255,255,.12)!important;
}
.footer-important a:hover{color:#fff!important;background:rgba(255,255,255,.08)!important;}
.footer-logo-mark{
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:22px!important;
}
.footer-sbc-verified a{
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(255,255,255,.14)!important;
  border-radius:18px!important;
  color:#fff!important;
}
.footer-sbc-copy{color:#fff!important;}
.footer-sbc-verified img{background:#fff!important;border-radius:12px!important;padding:6px!important;}
.footer-payments-block .payment-logo-row{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(95px,1fr))!important;
  gap:10px!important;
  overflow:visible!important;
  padding:0!important;
}
.footer-payments-block .payment-logo-row .payment-mini-card,
.footer-payments-block .payment-logo-row .payment-mini-card.bank-transfer,
.footer-payments-block .payment-logo-row .payment-mini-card.apple-pay,
.footer-payments-block .payment-logo-row .payment-mini-card.visa,
.footer-payments-block .payment-logo-row .payment-mini-card.mastercard,
.footer-payments-block .payment-logo-row .payment-mini-card.tamara,
.footer-payments-block .payment-logo-row .payment-mini-card.mada{
  width:100%!important;
  height:46px!important;
  background:#fff!important;
  border:1px solid rgba(255,255,255,.18)!important;
  border-radius:14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:7px 10px!important;
}
.footer-payments-block .payment-logo-row .payment-mini-card img{max-height:27px!important;max-width:90%!important;object-fit:contain!important;}
.footer-bottom-line{
  border-top:1px solid rgba(255,255,255,.12)!important;
  margin-top:32px!important;
}
.contact-float a{
  box-shadow:0 16px 36px rgba(47,28,106,.22)!important;
}
.contact-float .wa{background:#25D366!important;}
.contact-float .tg{background:#229ED9!important;}
/* Other inner pages: keep the same clean SaaS feeling */
main:not(.rdx-home),
.page,
.auth-page,
.dashboard-page{
  background:linear-gradient(180deg,#fff,#f5f3ff)!important;
  color:var(--rs-host-ink)!important;
}
.card,
.panel,
.box,
.form-card,
.auth-card,
.dashboard-card,
.order-card,
.bot-template-card,
.table-card{
  background:#fff!important;
  border:1px solid rgba(103,61,230,.14)!important;
  border-radius:24px!important;
  box-shadow:var(--rs-host-shadow)!important;
  color:var(--rs-host-ink)!important;
}
input,select,textarea{
  background:#fff!important;
  border:1px solid rgba(103,61,230,.22)!important;
  border-radius:14px!important;
  color:var(--rs-host-ink)!important;
}
input:focus,select:focus,textarea:focus{
  outline:0!important;
  border-color:var(--rs-host-purple)!important;
  box-shadow:0 0 0 4px rgba(103,61,230,.12)!important;
}
@media(max-width:1180px){
  .header .wrap.nav{grid-template-columns:1fr!important;justify-items:center!important;gap:10px!important;}
  .header .brand{justify-content:center!important;text-align:center!important;}
  .header .links{justify-content:center!important;max-width:100%!important;}
  .header .actions{justify-content:center!important;}
  .rdx-hero-grid{grid-template-columns:1fr!important;gap:32px!important;}
  .rdx-hero-copy{text-align:center!important;}
  .rdx-hero p{margin-inline:auto!important;}
  .rdx-hero-actions,.rdx-trust-row{justify-content:center!important;}
  .rdx-float-a{right:12%!important;}
  .rdx-float-b{left:12%!important;}
  .rdx-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .rdx-process-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:900px){
  .wrap,.rdx-gh-page .wrap{width:min(100% - 32px,1208px)!important;}
  .rdx-hero{padding:56px 0!important;}
  .rdx-section{padding:56px 0!important;}
  .rdx-price-grid{grid-template-columns:1fr!important;}
  .rdx-price-grid p{min-height:auto!important;}
  .rdx-package-group{padding:18px!important;border-radius:24px!important;}
  .footer-payments-block .payment-logo-row{grid-template-columns:repeat(2,minmax(120px,1fr))!important;}
}
@media(max-width:640px){
  .wrap,.rdx-gh-page .wrap{width:min(100% - 24px,1208px)!important;}
  .header .logo{width:48px!important;height:48px!important;flex-basis:48px!important;}
  .header .brand-title{font-size:15px!important;white-space:normal!important;}
  .header .brand small{font-size:11px!important;}
  .header .links{
    justify-content:flex-start!important;
    overflow-x:auto!important;
    flex-wrap:nowrap!important;
    width:100%!important;
    padding:6px 2px 10px!important;
  }
  .header .links::-webkit-scrollbar{height:0!important;}
  .header .actions{width:100%!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;}
  .header .actions .btn,.header .actions .lang,.auth-chip{width:100%!important;font-size:12px!important;}
  .rdx-hero h1{font-size:34px!important;letter-spacing:-.02em!important;}
  .rdx-hero p{font-size:15.5px!important;}
  .rdx-btn{width:100%!important;}
  .rdx-trust-row span{width:100%!important;text-align:center!important;}
  .rdx-phone-card{transform:none!important;width:100%!important;}
  .rdx-hero-visual{min-height:auto!important;}
  .rdx-float{display:none!important;}
  .rdx-service-grid,.rdx-process-grid{grid-template-columns:1fr!important;}
  .rdx-service-card{min-height:auto!important;padding:82px 20px 22px!important;}
  .rdx-service-card h3{padding-inline-end:0!important;padding-top:10px!important;}
  .rdx-price-grid h4.rdx-price-sar b{font-size:37px!important;}
  .rdx-price-grid h4.rdx-price-sar img{width:28px!important;height:28px!important;min-width:28px!important;}
  .footer-payments-block .payment-logo-row{grid-template-columns:1fr 1fr!important;}
}