/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.
by : amjad alnjlat + mohammed alhomsi
***************************************************** */

:root{
  --PrimaryColor: #BB3030;
  --SecondaryColor: #1F3A40;
  --PrimaryHover: rgba(255,255,255,0.35);
  --SecondaryHover: rgba(255,255,255,0.35);
  --BackgroundColor: #F7F7F9;
  --c-border: #1F3A40;
  --TextDark: #1F3A40;
  --TextBright: #FFFFFF;
  --hover: #9f1d22 ;
  /*--CairoFont: 'Cairo', sans-serif;*/
  --CairoFont: 'Noto Sans Arabic', sans-serif;
  --ShadowGray: 0 20px 50px rgba(0,0,0,.18);
}

:root {
  --fw-MainTitle: 400;
  --fw-Subtitle: 400;
  --fw-Buttons: 600;
  --fw-Text: 400;
}


@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&display=swap');

  html, body {
    font-family: var(--CairoFont) !important;
    margin-right: 0px !important;
    background: var(--BackgroundColor) !important;
    overflow-x: hidden !important;
  }
  
  h1, h2, h3, h4, h5, h6 {
    font-family: var(--CairoFont);
  } 

  /* Navbar / Menüs */
  .navbar, .navbar a,
  .top-nav, .top-nav a,
  .nav, .nav a,
  .dropdown-menu, .dropdown-menu a {
    font-family: inherit;
  }

  /* Buttons (wichtig: .btn ist oft <a class="btn">) */
  .btn, .btn a {
    font-family: inherit;
  }
  
  .container {
    padding-right: 19px;
    padding-left: 19px;
  }
  ::-moz-selection { background: var(--PrimaryColor); color: white}
  ::selection { background: var(--PrimaryColor); color: white;}
  ::-webkit-scrollbar {
    width: 11px;
    background-color: #E7E7E7;
  }
  ::-webkit-scrollbar-thumb {
    background-color: var(--PrimaryColor);
    border-radius: 2px;
  }
  ::-webkit-scrollbar-thumb:hover {
    background-color: var(--PrimaryColor);
    border-radius: 10px;
  }
  #order-standard_cart .view-cart-items-header {
    background-color: var(--PrimaryColor);
  }
  .main-navbar-wrapper {
      background-color:var(--PrimaryColor);
      border:0;
      border-radius: 0;
      border-bottom: 0;
  }
 
  .main-navbar-wrapper .navbar-nav>li>a {
      
      font-size: 14px !important;
      text-transform: uppercase;
      /* padding-top: 12px;
      padding-bottom: 12px; */
      /* line-height: 20px; */
      color: var(--TextBright);
      padding-left: 16px;
      padding-right: 16px;
      top: 0%;
      transition: all 0.1s ease-out;
      border-bottom: 1px solid transparent;
      font-weight: 300;
  }
  .main-navbar-wrapper .navbar-nav>li>a:focus,
  .main-navbar-wrapper .navbar-nav>li>a:hover {
      border-color: var(--SecondaryHover);
      background-color: var(--SecondaryHover);
      color: var(--TextBright);
  }
  .main-navbar-wrapper .navbar-nav>.active>a,
  .main-navbar-wrapper .navbar-nav>.active>a:focus,
  .main-navbar-wrapper .navbar-nav>.active>a:hover {
      color: #fff;
      background-color: var(--PrimaryColor);
      border-bottom-color: transparent;
  }
  .main-navbar-wrapper .navbar-nav>.disabled>a,
  .main-navbar-wrapper .navbar-nav>.disabled>a:focus,
  .main-navbar-wrapper .navbar-nav>.disabled>a:hover {
      color: #ccc;
      background-color: transparent
  }
  .main-navbar-wrapper .navbar-toggle {
      border-color: #333
  }
  .main-navbar-wrapper .navbar-toggle:focus,
  .main-navbar-wrapper .navbar-toggle:hover {
    color: #fff;
    background-color: var(--PrimaryColor);
    border: 0;
  }
  .main-navbar-wrapper .navbar-toggle .icon-bar {
      background-color: #fff;
  }
  .main-navbar-wrapper .navbar-collapse,
  .main-navbar-wrapper .navbar-form {
     border-color: #101010
  }
  /* .main-navbar-wrapper .navbar-nav>.open>a,
  .main-navbar-wrapper .navbar-nav>.open>a:focus,
  .main-navbar-wrapper .navbar-nav>.open>a:hover {
    color: var(--BackgroundColor);
    background-color: transparent !important;
  }
  
  .main-navbar-wrapper .navbar-link {
      color: #9d9d9d
  }
  .main-navbar-wrapper .navbar-link:hover {
      color: var(--BackgroundColor)
  }
  .main-navbar-wrapper .btn-link {
      color: #9d9d9d
  } */
  
  /* .dropdown-menu {
      position: absolute;
      top: 100%;
      left: 0;
      z-index: 1000;
      display: none;
      float: left;
      min-width: 160px;
      padding: 5px 0;
      margin: 2px 0 0;
      font-size: 14px;
      text-align: left;
      list-style: none;
      background-color: rgba(0,0,0,0.9);
      -webkit-background-clip: padding-box;
      background-clip: padding-box;
      border: 1px solid #ccc;
      border: 1px solid rgba(0, 0, 0, .15);
      border-radius: 4px;
      -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
      box-shadow: 0 6px 12px rgba(0, 0, 0, .175)
  } */
  /* .dropdown-menu>li>a {
      display: block;
      padding: 3px 20px;
      clear: both;
      font-weight: 300;
      line-height: 1.32857143;
      color: #9d9d9d;
      white-space: nowrap;
      padding-top: 9px;
      padding-bottom: 9px;
  }
  .dropdown-menu>li>a:focus,
  .dropdown-menu>li>a:hover {
      text-decoration: none;
      color: #fff !important;
      background-color: transparent !important;
  }
  .dropdown-menu>.active>a,
  .dropdown-menu>.active>a:focus,
  .dropdown-menu>.active>a:hover {
      color: #fff;
      text-decoration: none;
      background-color: #337ab7 !important;
      outline: 0
  }
  .nav-divider {
    border-color: #2B2B2B !important;
    color: #2B2B2B !important;
    background-color: #2B2B2B !important;
  }
  .nav-divider:hover {
    border-color: #2B2B2B !important;
    color: #2B2B2B !important;
    background-color: #2B2B2B !important;
  }
   */
  /* #header {
    background-color:var(--BackgroundColor) !important;
    border-radius: 0 !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
  }

  #top-nav {
    background-color: transparent !important;
  }
  */.header-lined h1 {
    color: var(--PrimaryColor) !important;
  }/*
  .list-group-item .active {
    background-color: var(--PrimaryColor) !important;
  }
  div.sidebar .list-group-item-selected {
      background-color: var(--PrimaryColor) !important;
      color: var(--PrimaryColor);
  }
  .navbar-main li.account {
    background-color: transparent!important;
  }

  a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus {
      border-top: 1px solid transparent !important;
      background-color: var(--PrimaryColor) !important;
      border-bottom: 1px solid transparent !important;
  }
  .dataTables_wrapper .dataTables_info
  {
    background-color: var(--PrimaryColor) !important;
  }
  .home-shortcuts {
    background-color: var(--PrimaryColor) !important;
  }
  .home-shortcuts li, .home-shortcuts li:first-child {
    border-color: var(--BackgroundColor)
  } */
/* ==================================================
   Dropdown Section
================================================== */
/* Dropdown Desktop */
.dropdown-menu {
    background-color: var(--BackgroundColor);
}

@media (max-width: 576px) {

    .dropdown-menu {
        min-width: 140px;
        font-size: 13px;
        border-radius: 6px;
        padding: 4px 0;
    }

    .dropdown-item {
        padding: 6px 12px !important;
        font-size: 13px;
    }

}
/* ==================================================
   Dropdown Section End
================================================== */
/* ==================================================
   Picture below the Header
================================================== */
.hero-section {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 100%;
    height: 480px;
    background-color: #071726;
    /* background-image : url("/templates/whmcs-lowendred/img/hero-banner.png"); */
    /* background-size: cover;
    background-position: center;
    background-repeat: no-repeat; */

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
    margin-bottom: 40px;
}
/* .hero-overlay {
    position: absolute;
    inset: 0;
} */
.hero-text {
    position: relative;
    z-index: 2;
    text-align: center;
    color: var(--TextBright);
}
.home-domain-search h2 {
  margin: 0;
  font-weight: var(--fw-Subtitle);
}

.hero-text .hero-title {
    font-size: 40px;
    font-weight: var(--fw-MainTitle);
    margin-bottom: 15px;
    line-height: 1.3;
    color: var(--TextBright); 
}

@media (max-width: 575px){

.hero-text .hero-title {
    font-size: 25px;
    font-weight: var(--fw-MainTitle);
    margin-bottom: 15px;
    line-height: 1.3;
    color: var(--TextBright); 
}
.hero-text .hero-sub {
    font-size: 14px;
}
.home-domain-search h2{
  font-size: 25px;   /* ← hier Größe anpassen */
  font-weight: 500;
}
}

/* 
.hero-text .hero-sub {
    font-size: 22px;
    line-height: 1.6;
    color: var(--TextBright); 
    max-width: 800px;
    margin: 0 auto;
}

.hero-domain-form{
  margin: 24px auto;
}

.hero-domain-form .form-control {
  border-radius: 90px 0px 0px 90px;
  background: var(--BackgroundColor);
  border : 3px solid var(--BackgroundColor);
    
}

.hero-domain-form .btn.search {
  background: var(--PrimaryColor);
  color: var(--TextBright);
  border : 3px solid var(--BackgroundColor);
  font-weight: 700;
  transition: transform .22s ease, box-shadow .22s ease;
}

.hero-domain-form .btn.search:hover {
  transform: translateY(-2px);
  filter: brightness(0.85);
}

.hero-domain-form .btn.transfer {
  background: var(--SecondaryColor);          
  color: var(--TextBright);
  font-weight: 700;
  border-radius: 0 90px 90px 0;
  border : 3px solid var(--BackgroundColor);
  transition: transform .22s ease, box-shadow .22s ease;
}

.hero-domain-form .btn.transfer:hover {
  transform: translateY(-2px);
  filter: brightness(0.85);
}
.hero-section::before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(31, 58, 64, 0.8);
  z-index: 1;
} */
/* ==================================================
   Why Horanos Section
================================================== */
/*
.why-horanos-section .why-card{
  background: var(--BackgroundColor);
  border: 5px solid var(--c-border);
  border-radius: 22px;
  padding: 30px 26px;
  min-height: 240px;
  height: 100%;
  box-shadow: 10px 10px 30px 1px var(--SecondaryColor); 
  box-shadow: var(--ShadowGray);
  border: 2px solid var(--SecondaryColor);
  transition: transform .22s ease, box-shadow .22s ease;
}*/
/* .why-horanos-section .why-card:hover{
  transform: translateY(-6px);
  box-shadow: 10px 10px 30px 1px var(--PrimaryColor);
} */
 /*
.why-horanos-section .why-card-icon{
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;

  margin: 0 auto 16px auto;
}

.why-horanos-section .why-card-icon,
.why-horanos-section .why-card-icon i{
  color: var(--PrimaryColor);   
  font-size: 50px;
}
.why-horanos-section .why-card-title{
  font-size: 18px;
  font-weight: var(--fw-Subtitle);
  margin: 0 0 10px;
  color: var(--SecondaryColor);
}
.why-horanos-section .why-card-text{
  font-size: 15px;
  font-weight:  var(--fw-Text);
  line-height: 1.7;
  margin: 0;
  color: var(--SecondaryColor);
}*/

/* ===== Section Styling ===== */
.why-floating {
  padding: 100px 20px;
  background: var(--BackgroundColor); /* نفس خلفية الموقع */
}

.why-floating__container {
  max-width: 1180px;
  margin: 0 auto;
}

.why-floating__header {
  max-width: 680px;
  margin: 0 auto 70px;
  text-align: center;
}

.why-floating__header span {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--PrimaryColor);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
}

.why-floating__header h2 {
  margin: 0 0 14px;
  color: var(--TextDark);
  font-size: clamp(30px, 4vw, 48px);
  font-weight: 800;
}

.why-floating__header p {
  margin: 0 auto;
  max-width: 600px;
  color: var(--SecondaryColor);
  line-height: 1.8;
}

/* GRID */
.why-floating__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

/* CARD */
.why-floating__card {
  position: relative;
  padding: 65px 30px 30px;
  text-align: center;
  border-radius: 18px;
  background: var(--TextBright);
  border: 1px solid rgba(0,0,0,0.05);
}

/* ICON FLOAT */
.why-floating__icon {
  position: absolute;
  top: -35px;
  left: 50%;
  transform: translateX(-50%);
  width: 70px;
  height: 70px;
  border-radius: 18px;
  background: var(--PrimaryColor);
  color: var(--TextBright);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;

  /* أنيميشن عائم ناعم */
  animation: floatY 3.5s ease-in-out infinite;
}

/* تأخير بسيط لكل أيقونة */
.why-floating__card:nth-child(2) .why-floating__icon {
  animation-delay: 0.4s;
}
.why-floating__card:nth-child(3) .why-floating__icon {
  animation-delay: 0.8s;
}

/* TEXT */
.why-floating__card h3 {
  margin: 0 0 10px;
  color: var(--TextDark);
  font-size: 20px;
  font-weight: 700;
}

.why-floating__card p {
  margin: 0;
  color: var(--SecondaryColor);
  font-size: 15px;
  line-height: 1.7;
}

/* FLOAT ANIMATION */
@keyframes floatY {
  0%, 100% {
    transform: translate(-50%, 0);
  }
  50% {
    transform: translate(-50%, -8px);
  }
}

/* RESPONSIVE */
@media (max-width: 900px) {
  .why-floating__grid {
    grid-template-columns: 1fr;
    gap: 50px;
  }
}
/*CSS الخاص بـ بطاقات من حورانوس*/


/*
@media (max-width: 992px) {
  .why-cards {
    flex-direction: column;
    align-items: center;
  }
}
*/
 /* #order-boxes .fields-container {
    border-top-color: var(--PrimaryColor) !important;
    border-bottom-color: var(--PrimaryColor) !important;
  }
  #order-boxes .fields-container .field-row:nth-child(even) {
    background-color:  var(--BackgroundColor) !important;
  }
  #order-boxes .fields-container .field-row:nth-child(odd) {
    background-color:  var(--BackgroundColor)!important;
  }
  #order-boxes table.styled tr th {
    background-color: var(--PrimaryColor) !important;
  }
  #order-boxes table.styled tr.carttablesummary td {
    background-color: var(--BackgroundColor) !important;
  }
  .alert-info {
    background-color: rgba(232, 102, 76, 0.8) !important;
    color:  var(--BackgroundColor) !important;
  }
  .form-control {
    min-height: 40px;
  }
  .form-control:focus, .form-control:active {
    border-color: transparent !important;
    box-shadow: 0 0px 0px rgba(255, 255, 255, 0.8) inset, 0 0 4px rgba(255, 255, 255, 0.8) !important;
  }
.lehlogo {
    max-width: 255px !important;
    display: block;
    margin-top: 4px;          
    margin-left: 50px;        
} */
/*
/* ==================================================
   Hosting Plans
================================================== 

.plans-wrapper{
  display: flex;
  gap: 24px;
  align-items: stretch;
}

.plan-card{
  background: var(--BackgroundColor);
  /*border: 2px solid var(--SecondaryColor);
  border-radius: 22px;
  padding: 30px 26px;
  box-shadow: var(--ShadowGray); 
  transition: transform .22s ease, box-shadow .22s ease;

  flex: 1 1 0;              
}



.plan-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 28px 70px rgba(0,0,0,.22);
}
.plan-badge{
  background: transparent;
  color: var(--PrimaryColor);
  border: 2px solid var(--PrimaryColor);
  border-radius: 999px;
  padding: 4px 12px;
  font-weight: var(--fw-Subtitleplan-features li);
  font-size: 12px;
  display: inline-block;
  margin-bottom: 10px;
}
.plan-title{
  color: var(--SecondaryColor);
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
}


.plan-desc{
  color: var(--SecondaryColor);
  font-size: 14px;
  margin-bottom: 18px;
}

 
.plan-features{
  margin: 0 0 18px;
  padding: 0;
  padding-left: 28px;
  margin-left: 0;
}
.plan-features li{
  color: var(--SecondaryColor);
  font-size: 14px;
  font-weight: var(--fw-Text);
  margin-bottom: 6px;
}
.plan-price{
  color: var(--SecondaryColor);
  font-size: 22px;
  font-weight: var(--fw-Buttons);
  margin-bottom: 16px;
}
.plan-price .currency,
.plan-price .period{
  font-size: 13px;
  font-weight: 500;
  color: var(--SecondaryColor);
}

.plans-wrapper .btn-plan,
.plans-wrapper .btn-plan:link,
.plans-wrapper .btn-plan:visited {
  color: #fff !important;
  text-decoration: none !important;
  -webkit-tap-highlight-color: transparent !important;
}
.btn-plan{
  display: inline-block;
  border-radius: 999px;
  padding: 10px 18px;
  font-weight: 600;
  text-decoration: none;
  /* border: 2px solid var(--PrimaryColor); 
  color: var(--BackgroundColor);
  background-color: var(--PrimaryColor);
  transition: all .2s ease;
}
.plan-card .btn-plan{
  display: block;
  width: 100%;
  text-align: center;
  border-radius: 8px !important;   
  padding: 12px 20px;              
  font-weight: var(--fw-Buttons);
  text-transform: none;           
  letter-spacing: .2px;
}
.plans-wrapper,
.plans-row,
#hosting-plans .plans-wrapper{
  align-items: stretch;
}

.plan-card{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.plan-card .plan-price{
  margin-top: auto;
}

.plan-card .btn-plan{
  margin-top: 12px;
  display: block;
  width: 100%;
}
.plan-card .plan-title{
  min-height: 48px;
  font-weight: var(--fw-Subtitle);
}
.plan-card .plan-desc{
  min-height: 52px;
}
/*
/*
ul.top-nav.top-nav-modern li.top-lang a,
ul.top-nav.top-nav-modern li.top-lang a:link,
ul.top-nav.top-nav-modern li.top-lang a:visited {
    color: var(--PrimaryColor) !important; 
    transition: color 0.2s ease;
}

ul.top-nav.top-nav-modern li.top-lang a:hover,
ul.top-nav.top-nav-modern li.top-lang.open a {
    color: var(--SecondaryColor) !important;
}

.plan-card .btn-plan,
.plan-card .btn-plan:hover,
.plan-card .btn-plan:focus,
.plan-card .btn-plan:active,
.plan-card .btn-plan:focus-visible{
  color: #fff !important;
}


  .btn-info, .btn-default{
  background-color: transparent !important;
  color: var(--PrimaryColor);
  border: 1px 1px 1px 1px;
  border-style: solid;
  border-color: var(--PrimaryColor);
  }
  ul.top-nav>li.primary-action>a.btn {
    background-color: var(--PrimaryColor) !important;
  }
  ul.top-nav>li>a:hover {
      color: #fff !important;
  }*/
  .btn-info:hover, .btn-info:focus, .btn-default:hover, .btn-default:focus, .btn-primary:hover, .btn-primary:focus {
    background-color: var(--PrimaryColor) !important;
    border-color: transparent;
    color: white;
  }
  .btn-warning, .btn-primary {
    background-color: var(--PrimaryColor);
    color: white;
    border-color: transparent;
  }
  .btn-warning:hover, .btn-warning:focus, .btn-primary:hover, .btn-primary:focus {
    background-color: var(--PrimaryColor) !important;
    border-color: var(--PrimaryColor) !important;
  }
/*  
.hfpro-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
}  */

 /*
.logincontainer {
    background-color: white;
    padding: 40px 60px 40px 60px;
    border-radius: 4px;
}

section.hero-domain-wrap h2 {
    color:var(--TextDark);
    font-size: 26px;
    font-weight: 600;
    margin: 0 0 16px;
}

section.hero-domain-wrap p {
    color: #b8b8b8;
    font-size: 13px;
    margin: 0 0 18px;
}

section.hero-domain-wrap .form-control {
    min-height: 46px;
    border-radius: 999px 0 0 999px;
    border: none;
    padding-left: 18px;
    font-size: 14px;
    box-shadow: none !important;
}

section.hero-domain-wrap .input-group-btn .btn {
    min-height: 46px;
    padding: 0 24px;
    border-radius: 0 999px 999px 0;
    font-weight: 600;
    border: none;
}
section.hero-domain-wrap .btn.search,
section.hero-domain-wrap #btnSearch {
    background:var(--PrimaryColor) !important;
    color:var(--BackgroundColor) !important;
    border: none !important;
}
section.hero-domain-wrap .btn.transfer,
section.hero-domain-wrap #btnTransfer {
    background: transparent !important;
    color:var(--PrimaryColor)!important;
    border-left: 1px solid rgba(255,255,255,0.18) !important;
}
#why-horanos {
    margin-bottom: 0 !important;
}
.btn-plan-primary:hover {
    background: var(--PrimaryColor);
    border-color:var(--PrimaryColor);
} */
#main-body {
    background:  var(--BackgroundColor) !important;
    /* padding-top: 0px !important;   */
    padding-bottom: 0px !important;
}
.hp-section {
    background: var(--SecondaryColor);
    padding: 60px 0;
}
.hp-section-alt {
    background: var(--SecondaryColor);
}
.hp-section-inner {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}
.hp-section-header {
    text-align: center;
    margin-bottom: 36px;
}
.hp-section-title {
    font-size: 28px;
    font-weight: var(--fw-Subtitle);
    color:  var(--TextDark);
    margin: 0 0 8px;
}
.hp-section-subtitle {
    font-size: 14px;
    font-weight: var(--fw-Text);
    color:  var(--TextDark);
    max-width: 640px;
    margin: 0 auto;
}
/* .testimonial-grid{
  display: flex;
  gap: 24px;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
} */

.testimonial-grid{
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px,1fr));
  gap: 22px;
}


.testimonial-card{
  background: var(--TextBright) !important;
  border: 0 !important;
  border-radius: 20px !important;
  padding: 22px 22px 20px !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.08) !important;
  transition: transform .25s ease, box-shadow .25s ease;
  position: relative;
}


/* .testimonial-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 28px 70px rgba(0,0,0,.14) !important;
} */


.testimonial-card::before{
  content: "🌍";
  position: absolute;
  top: 16px;
  left: 16px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--BackgroundColor);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}
.testimonial-card p{
  margin-top: 42px;
  font-size: 15px;
  font-weight: var(--fw-Text);
  line-height: 1.6;
  opacity: .9;
}
/* .testimonial-tags{
  display: flex;
  gap: 8px;
  margin: 14px 0 18px;
  flex-wrap: wrap;
} */
/* .testimonial-tags span{
  font-size: 12px;
  padding: 4px 10px;
  background: #f4f6fb;
  border-radius: 999px;
  opacity: .8;
} */
/* .testimonial-meta{
  display: flex !important;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
} */

/* .testimonial-meta img{
  width: 36px;
  height: 36px;
  border-radius: 50%;
} */

/* .testimonial-name{
  font-weight: 600;
} */

.testimonial-role{
  font-size: 12px;
  opacity: .65;
}

.payment-row{
  display: flex;
  gap: 14px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.payment-pill{
  background: var(--BackgroundColor);
  border: 2px solid var(--SecondaryColor);
  color: var(--SecondaryColor);
  border-radius: 999px;
  padding: 10px 18px;
  font-weight: var(--fw-Buttons);
  font-size: 15px;
  box-shadow: var(--ShadowGray);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.faq-item[open] .faq-content{
  animation: faqOpen 5s ease forwards;
}

@keyframes faqOpen{
  from { max-height: 0; opacity: 0; transform: translateY(-4px); }
  to   { max-height: 500px; opacity: 1; transform: translateY(0); }
}
.faq-list{
  max-width: 780px;
  margin: 0 auto;
}

.faq-item{
  background: var(--BackgroundColor);
  border: 2px solid var(--SecondaryColor);
  border-radius: 16px;
  padding: 0;
  margin-bottom: 12px;
  box-shadow: var(--ShadowGray);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.faq-item summary{
  cursor: pointer;
  padding: 5px 10px;
  list-style: none;
  font-size: 14px;
  font-weight: var(--fw-Subtitle);
  color: var(--SecondaryColor);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
/* .faq-item summary::-webkit-details-marker{
  display: none;
} */
.faq-item summary::after{
  content: "+";
  flex: 0 0 auto;
  width: 25px;
  height: 25px;
  border-radius: 999px;
  border: 2px solid var(--SecondaryColor);
  color: var(--PrimaryColor);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  line-height: 1;
}
.faq-item[open] summary::after{
  content: "–";
  border-color: var(--PrimaryColor);
}
.faq-item p{
  margin: 0;
  padding: 0 16px 14px;
  color: var(--SecondaryColor);
  font-size: 12px;
  font-weight: var(--fw-Text);
  line-height: 1.7;
  opacity: .9;
}
.faq-item[open] summary{
  border-bottom: 1px solid rgba(31,58,64,.18);
}

.cta-box {
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
    padding: 32px 24px 34px;
    border-radius: 22px;
    background:var(--BackgroundColor);
    box-shadow: var(--ShadowGray);
}
.cta-title {
    font-size: 26px;
    font-weight: 500;
    color: var(--TextDark);
    margin: 0 0 10px;
}
.cta-subtitle {
    font-size: 14px;
    color:  var(--TextDark);
    max-width: 520px;
    margin: 0 auto 20px;
}
/* .cta-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
} */
.cta-btn {
    display: inline-block;
    padding: 10px 24px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}
.cta-btn-primary {
    background: var(--PrimaryColor);
    color:  var(--TextBright);
    border-color: var(--BackgroundColor);
}
.cta-btn-primary:hover {
    background: var(--BackgroundColor);
    border-color: var(--PrimaryColor);
    text-decoration: none;
}
.cta-btn-ghost {
    background: var(--SecondaryColor);
    color:  var(--BackgroundColor);
}
.cta-btn-ghost:hover {
    background: var(--BackgroundColor);
    color:  var(--SecondaryColor);
    border-color: var(--SecondaryColor);
    text-decoration: none;
  }
/* ul.top-nav.top-nav-modern {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
    padding: 8px 0;
    list-style: none;
}

ul.top-nav.top-nav-modern li {
    margin: 0;
    padding: 0;
}


ul.top-nav.top-nav-modern li.top-text a{
    color: var(--PrimaryColor);
}

ul.top-nav.top-nav-modern li.top-text a:hover {
    color: var(--SecondaryColor) !important;
}

ul.top-nav.top-nav-modern li.top-icon a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 50% !important;
    background: var(--PrimaryColor);
    color: #f5f5f5 !important;
    text-decoration: none;
    box-shadow: none;
    line-height: 0 !important;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

ul.top-nav.top-nav-modern li.top-icon a.btn {
    box-shadow: none !important;
    border-radius: 50% !important;
}

ul.top-nav.top-nav-modern li.top-icon a i {
    font-size: 15px;
    line-height: 1;
}

ul.top-nav.top-nav-modern li.top-icon a:hover {
    background: var(--PrimaryColor);
    border-color: var(--PrimaryColor);
    color: #ffffff !important;
    transform: translateY(-1px);
}
.top-btn.btn {
    padding: 0 !important;
    border-radius: 50% !important;
}
.top-btn:hover {
    background: var(--PrimaryColor);
    border-color: var(--PrimaryColor);
    color: #ffffff;
    transform: translateY(-1px);
}
.navbar-main .fa-shopping-cart,
.navbar-main .fas.fa-shopping-cart {
    display: none !important;
}
.top-btn-cart i.fa-shopping-cart,
.top-btn-cart i.fas.fa-shopping-cart {
    display: inline-block !important;
}
#header a.logo {
    display: block !important;
    margin: 0 auto !important;        
    transform: translate(-10px, 9px) !important;
    
}
#header a.logo.logo-text {
    text-align: center;
    font-size: 26px;
    font-weight: 700;
    letter-spacing: 0.35em;
}
#header .container {
    position: relative; 
} */
/* #header .top-nav,
#header .top-nav.top-nav-modern {
    position: relative;
    z-index: 5;  
}
#header a.logo {
    position: relative;
    z-index: 1;   
} */
/* input[type="search"],
input#domainSearch,
#domainSearch {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: #fff !important;
}
.domain-search,
.domain-search-wrapper,
.domain-section,
.hero-search,
.search-box {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
} */
/* section.hero-domain-wrap {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}
section.hero-domain-wrap::before {
    content: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
} */
section#hosting-plans {
    background: transparent !important;
}
/* section#testimonials,
section#testimonials.hp-section {
    background: transparent !important;
} */

/* section#testimonials::before,
section#testimonials::after {
    background: transparent !important;
    content: none !important;
} */
.hp-section,
.hp-section-alt,
.hp-cta-section {
    background: transparent !important;
    
}
/* .hp-section::before, */
.hp-section::after
/* .hp-section-alt::before, */
/* .hp-section-alt::after, */
/* .hp-cta-section::before, */
/* .hp-cta-section::after  */
{
    content: none !important;
    background: transparent !important;
}
.sidebar .panel,
.sidebar .panel-heading,

/* .domainchecker-result,
.domainresults {
    background:var(--BackgroundColor) !important;
    border: 1px solid var(--c-border) !important;
    color: #f5f5f5 !important;
}
.domainresults h3,
.domainresults .panel-heading,
*/
.domainresults .header-lined {
    color:var(--PrimaryColor) !important;
}
.domainresults table,
.domainresults .table {
    background:var(--BackgroundColor) !important;
    border-collapse: separate;
    border-spacing: 0;
}
.domainresults .table tr {
    background:var(--BackgroundColor) !important;
    color: #f5f5f5 !important;
}
.domainresults .table tr:nth-child(even) {
    background: #181b22 !important;
}
.domainresults .table tr:hover {
    background: rgba(215,68,68,0.18) !important;
} 
.domainresults .table td {
    border-top: 1px solid var(--c-border) !important;
    color: #e4e4e4 !important;
    font-size: 13px;
}
.domainresults .table td:first-child a {
    color: #ffffff !important;
    text-decoration: none;
}
.domainresults .table td:first-child a:hover {
    color:var(--PrimaryColor) !important;
}
.domainresults .table td.text-right,
.domainresults .table td:nth-child(2) {
    color: #ffbcae !important;
}
.domainresults .table td .btn,
.domainresults .table td button {
    background: var(--PrimaryColor) !important;
    border: none !important;
    color: #ffffff !important;
    border-radius: 999px !important;
    padding: 3px 12px !important;
    font-size: 11px;
    font-weight: 600;
}
.domainresults .table td .btn:hover {
    background: var(--PrimaryColor) !important;
}
/* #btnShowMoreSuggestions {
    background: rgba(215,68,68,0.18) !important;
    border: 1px solid var(--PrimaryColor) !important;
    color: #ffffff !important;
    border-radius: 0 !important;
} */
/* #btnShowMoreSuggestions:hover {
    background: var(--PrimaryColor) !important;
} */
#domainSuggestions{
  background:var(--BackgroundColor);
  border:1px solid var(--SecondaryColor);
  /* border-radius:16px; */
  box-shadow:0 18px 40px rgba(0,0,0,0.55);
  overflow:hidden;
}
#domainSuggestions .domain-suggestion{
  background:transparent;
  border:0;
  padding:14px 18px;
  grid-template-columns: 1fr 70px auto auto;
  justify-content:flex-start;
  gap:12px;
  border-bottom:1px solid rgba(0,0,0,.03);
  transition:background .25s ease, transform .25s ease;
}
#domainSuggestions .domain-suggestion:last-child{
  border-bottom:0;
}
#domainSuggestions .domain-suggestion:hover{
  background:rgba(187,48,48,.08); 
}
#domainSuggestions .domain-name{
  font-weight:1000;
  color:var(--TextDark);
  display:flex;
  align-items:center;
  gap:4px; 
}
#domainSuggestions .extension{
  font-weight:700;
  color:var(--PrimaryColor);
}
#domainSuggestions .price{
  color:var(--SecondaryColor);
  font-weight:600;
}
#domainSuggestions .domain-suggestion:hover .domain-name,
#domainSuggestions .domain-suggestion:hover .extension{
  color:var(--PrimaryColor);
}
#domainSuggestions .domain-suggestion:hover .price{
  color:var(--SecondaryColor);
}
#domainSuggestions .btn,
#domainSuggestions button,
#domainSuggestions input[type="button"]{
  border-radius:999px;
  padding:7px 14px;
  border:0;
  background:var(--PrimaryColor);
  color:var(--TextBright);
  font-size:12px;
  transition:filter .2s ease, transform .2s ease;
}
#domainSuggestions .btn:hover,
#domainSuggestions button:hover,
#domainSuggestions input[type="button"]:hover{
  filter:brightness(.92);
  transform:translateY(-1px);
}
#domainSuggestions .extension{
  margin-left:0;
}
#order-standard_cart .cart-sidebar .panel {
    background: var(--BackgroundColor);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
    border: 1px solid rgba(0,0,0,0.08);
    overflow: hidden;
}
#order-standard_cart .cart-sidebar .panel-heading {
    background:var(--BackgroundColor);
    color: var(--PrimaryColor);
    font-weight: 600;
    font-size: 16px;
    padding: 12px 16px;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}
#order-standard_cart .cart-sidebar .list-group-item {
    background: transparent;
    color: var(--TextDark);
    font-size: 15px;
    padding: 11px 16px;
    border: none;
    position: relative;
    transition: all 0.25s ease;
}
#order-standard_cart .cart-sidebar .list-group-item::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 0;
    height: 1px;
    background: rgba(0,0,0,0.06);
}
#order-standard_cart .cart-sidebar .list-group-item:hover {
    background:var(--PrimaryColor);
    color: var(--TextBright);
    padding-left: 20px;
}
#order-standard_cart .cart-sidebar .list-group-item.active {
    background: linear-gradient(135deg, var(--PrimaryColor), var(--hover));
    color: var(--TextBright);
    font-weight: 600;
}
#order-standard_cart .cart-sidebar .list-group-item:last-child::after {
    display: none;
}
/* .domain-checker-container {
    background-image: none !important;
    background: linear-gradient(135deg, var(--SecondaryColor), rgba(0,0,0,0.85)) !important;
    border-radius: 12px !important;
} */
section.hero-domain-wrap .container {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}
section.hero-domain-wrap input[name="domain"] {
    background-color:var(--BackgroundColor)  !important;
    color: var(--TextBright) !important;
}
section#hosting-plans p {
  font-weight: var(--fw-Text);
    color: var(--TextDark)!important;
}
section#hosting-plans h2 {
  font-weight: var(--fw-Subtitle);
    color: var(--TextDark)!important;
}
#testimonials .hp-section-title {
   font-weight: var(--fw-Subtitle);
    color:  var(--TextDark);
}
#testimonials .hp-section-subtitle {
  font-weight: var(--fw-Text);
    color:  var(--TextDark);
}
 .site.hfpro-container{
  width: 100%;
  max-width: none;
  padding: 0 32px;
}
.hfpro-top-strip {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
.hfpro-top-strip-inner {
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap: 10px;
  padding: 8px 0;
}
.hfpro-highlight {
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: 12px;
  color:var(--TextBright);
  background: var(--PrimaryColor);
  border: 1px solid rgba(0,0,0,0.08);
  backdrop-filter: blur(10px);
}
.hfpro-highlight i {
  color:var(--TextBright);
  font-size: 13px;
}
/* @media (max-width: 991px){
  .navbar-nav .dropdown,
.navbar-nav .nav-item.dropdown{
    position: static !important;
  }

  .navbar-nav .dropdown-menu,
  .navbar-nav .dropdown-menu.show{
    position: static !important;
    float: none !important;
    width: 100% !important;
    max-width: 50% !important;
    min-width: 0 !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 8px 0 0 0 !important;
    padding: 10px 12px !important;
    box-sizing: border-box !important;
  }

  .navbar-nav .dropdown-item{
    font-size: 14px !important;
    padding: 10px 12px !important;
    white-space: normal !important;
  }
} */


#btnShowSidebar{
  display: none !important;
}
@media (max-width: 600px) {
    .why-hor-grid {
        grid-template-columns: 1fr;
    }
    #header .top-nav .top-text{
    display: none !important;
  }
}
/*
@media (max-width: 750px) {
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>.dropdown-header {
          border-color: #080808
      }
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu .divider {
          background-color: #080808
      }
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>li>a {
          color: #9d9d9d;
      }
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>li>a:focus,
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>li>a:hover {
          color: #fff;
          background-color: black;
      }
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>.active>a,
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>.active>a:focus,
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>.active>a:hover {
          color: #fff !important;
          background-color: #080808
      }
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>.disabled>a,
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>.disabled>a:focus,
      .main-navbar-wrapper .navbar-nav .open .dropdown-menu>.disabled>a:hover {
          color: #444;
          background-color: transparent
      }
  }

.navbar-nav > li > .dropdown-menu {
    background-color: var(--SecondaryColor) !important; 
}
.navbar-nav > li > .dropdown-menu a {
    color: #ffffff !important;
}
.navbar-nav > li > .dropdown-menu a:hover {
    background-color: var(--PrimaryColor) !important;
    color: #ffffff !important;
}
    */

/* ===============================
   PROFESSIONAL DROPDOWN MENU
   =============================== */

/* dropdown container */
/* .navbar .dropdown-menu {
  background: var(--SecondaryColor);
  border-radius: 14px;
  padding: 25px;
  border: none;
  box-shadow: 0 18px 40px rgba(0,0,0,0.25);
  min-width: 200px;
} */

/* dropdown item */
/* .navbar .dropdown-menu .dropdown-item {
  display: flex;
  align-items: center;

  padding: 10px 14px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;

  color: var(--TextBright) !important;
  border-radius: 10px;
  transition: background-color .15s ease, transform .12s ease;
  white-space: nowrap;
} */


/* .navbar .dropdown-menu .dropdown-item:hover,
.navbar .dropdown-menu .dropdown-item:focus {
  background:var(--PrimaryColor);
  transform: translateX(2px);
} */


/* .navbar .dropdown-menu .dropdown-item:active {
  background: rgba(255, 255, 255, 0.18);
} */


/* .navbar .dropdown-menu .dropdown-item:focus-visible {
  outline: none;
  box-shadow: none;
} */


    
@media (max-width: 1440px){
  }

.label-warning {
  background-color: var(--PrimaryColor);
}
.label-warning[href]:hover,
.label-warning[href]:focus {
  background-color: var(--SecondaryColor);
}
div.header-lined .breadcrumb li a {
    color: var(--SecondaryColor);
    font-size: 16px;
}
div.header-lined .breadcrumb > .active {
    color: var(--SecondaryColor);
    font-size: 16px;
}
.announcement-single .article-items {
    font-size: 0.85em;
    color: var(--SecondaryColor);
}
div.header-lined h1{
  border-bottom: 3.5px solid var(--SecondaryColor) !important;
}
.panel-sidebar .panel-title {
    font-size: 1.4em;
    color: var(--TextDark);
  }
  .domain-checker-bg {
    background-image: none !important;
    background: linear-gradient(120deg, var(--SecondaryColor), var(--SecondaryColor), var(--BackgroundColor)) !important;
}
.domain-promo-box{
  background:var(--BackgroundColor);
  border:1px solid rgba(0,0,0,0.55);
  border-radius:18px;
  padding:28px 26px;
  text-align:center;
  box-shadow:0 22px 28px rgba(0,0,0,0.70);
}
.domain-promo-box h3{color:#000000;font-weight:700;margin:0 0 6px}
.domain-promo-box p{color:var(--SecondaryColor);margin:0 0 20px}
.domain-promo-box .btn{
  border-radius:9px;
  padding:8px 16px;
  font-size:20px;
  border:0;
}
.domain-promo-box .btn-primary{
  background: var(--PrimaryColor) !important;;
  color:var(--BackgroundColor);
}
.domain-promo-box .btn-primary:hover,
.domain-promo-box .btn-primary:focus,
.domain-promo-box .btn-primary:active{
  background:var(--PrimaryColor) ;
  color:var(--BackgroundColor);
}
.domain-promo-box .btn-default{
  background:var(--SecondaryColor);
  color:var(--BackgroundColor);
}
.domain-promo-box .btn-default:hover,
.domain-promo-box .btn-default:focus,
.domain-promo-box .btn-default:active{
  background:var(--SecondaryColor) !important;
  color:var(--BackgroundColor);
}
#domainSuggestions .domain-name,
#domainSuggestions .extension{ font-size:20px; }
#domainSuggestions .price{ font-size:19px; }
#domainSuggestions .btn{ font-size:18px; }
#domainSuggestions .domain-suggestion span:first-child{
  font-size:20px;
  font-weight:600;
  border-radius: 12px;
}
#domainSuggestions{
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}
.suggested-domains .card-header,
.suggested-domains .panel-heading,
.suggested-domains .panel-heading,
.suggested-domains .panel-heading.card-header{
  border-bottom: 0 !important;
}
.verification-banner.email-verification .btn.btn-action {
    background-color: var(--BackgroundColor) !important;  
    border-color: #f0e4e4 !important;
    color: var(--PrimaryColor) !important;           
}

.verification-banner.email-verification .btn.btn-action:hover {
    background-color: var(--PrimaryColor) !important; 
    border-color: var(--PrimaryColor) !important;
    color: var(--BackgroundColor) !important;
}

#order-standard_cart .domain-pricing{
  display:none !important;
}
#order-standard_cart .view-cart-items-header{
  background-color: var(--PrimaryColor) !important; 
  color: var(--BackgroundColor) !important;
}

    
        
#domainSuggestions .domain-suggestion{
  display: flex !important;
  align-items: center;
  gap: 8px;
}
#domainSuggestions .domain-suggestion .actions{
  margin-left: auto;
  display: flex !important;
  align-items: center;
  gap: 12px;
}
#domainSuggestions .domain-suggestion .actions .hot,
#domainSuggestions .domain-suggestion .actions .badge,
#domainSuggestions .domain-suggestion .actions .label{
  order: 1;
}
#domainSuggestions .domain-suggestion .actions .price,
#domainSuggestions .domain-suggestion .actions [class*="price"]{
  order: 2;
}
#domainSuggestions .domain-suggestion .actions .btn,
#domainSuggestions .domain-suggestion .actions button,
#domainSuggestions .domain-suggestion .actions a.btn{
  order: 3;
}
#domainSuggestions .domain-suggestion.list-group-item.w-hidden:not(.clone){
  display: none !important;
} 
#order-standard_cart .empty-cart .btn {
    background-color: var(--PrimaryColor) !important; 
    border-color: var(--PrimaryColor) !important;
    color: var(--TextBright) !important;            
}
#order-standard_cart .view-cart-items,
#order-standard_cart .empty-cart {
    border: none !important;
}
.landing-page.ssl{
  display: flex;
  flex-direction: column;
}
.landing-page.ssl .hero{
  order: 1;
}
.landing-page.ssl > nav.navbar{
  order: 2;
  margin: 0 !important;
}
.landing-page.ssl .validation-levels{
  order: 3;
}
.landing-page.ssl .content-block{
  order: 4;
}
.landing-page.ssl .standout-1{
  order: 4;
}
.announcements .announcement h1 a {
    color: var(--SecondaryColor) !important; 
    font-size: 26px !important;  
}
#main-body .pricing-wrapper .pricing-card {
  border-radius: 16px !important;
  padding: 35px 25px !important;
}

/* ===== Hosting Showcase Premium ===== */

.hosting-showcase-section {
  padding: 90px 20px;
  background:
    radial-gradient(circle at top center, rgba(187,48,48,.08), transparent 35%),
    linear-gradient(180deg, #f8fbfd 0%, #eef4f8 100%);
}

.hosting-showcase-container {
  max-width: 1180px;
  margin: auto;
}

.hosting-showcase-header {
  text-align: center;
  margin-bottom: 50px;
}

.hosting-label {
  color: #bb3030;
  font-weight: 800;
}

.hosting-showcase-header h2 {
  font-size: 46px;
  font-weight: 900;
  color: #162b3a;
}

.hosting-showcase-header p {
  max-width: 760px;
  margin: auto;
  color: #64748b;
  font-size: 18px;
  line-height: 1.8;
}

.hosting-showcase-card {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 50px;
  align-items: center;
  background: #F7F7F9
 
 
}

.hosting-main-text {
  color: #425466;
  font-size: 18px;
  line-height: 1.9;
  margin-bottom: 30px;
}

.hosting-features-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-bottom: 35px;
}

.hosting-feature-item {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #f8fafc;
  border-radius: 16px;
  padding: 15px 16px;
  color: #162b3a;
  font-weight: 700;
}

.hosting-feature-item i {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(187,48,48,.1);
  color: #bb3030;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hosting-showcase-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #bb3030;
  color: #fff !important;
  padding: 16px 26px;
  border-radius: 16px;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 16px 35px rgba(187,48,48,.25);
  transition: .3s ease;
}

.hosting-showcase-btn:hover {
  transform: translateY(-4px);
  background: #a82929;
}

.hosting-showcase-visual {
  position: relative;
  height: 360px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hosting-orbit {
  position: absolute;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(187,48,48,.10), transparent 65%);
  border: 1px dashed rgba(187,48,48,.22);
}

.hosting-main-icon {
  width: 150px;
  height: 150px;
  border-radius: 36px;
  background: linear-gradient(135deg, #bb3030, #e34b4b);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 64px;
  box-shadow: 0 28px 60px rgba(187,48,48,.25);
  z-index: 2;
}

.hosting-floating-icon {
  position: absolute;
  width: 82px;
  height: 82px;
  border-radius: 24px;
  background: #fff;
  color: #bb3030;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  box-shadow: 0 18px 45px rgba(20,45,70,.12);
  z-index: 3;
}

.icon-cloud { top: 25px; right: 70px; }
.icon-shield { bottom: 35px; right: 55px; }
.icon-plug { bottom: 70px; left: 60px; }

@media (max-width: 992px) {
  .hosting-showcase-card {
    grid-template-columns: 1fr;
    padding: 35px;
  }

  .hosting-showcase-visual {
    height: 300px;
  }
}

@media (max-width: 600px) {
  .hosting-showcase-header h2 {
    font-size: 34px;
  }

  .hosting-features-grid {
    grid-template-columns: 1fr;
  }

  .hosting-showcase-card {
    padding: 26px;
  }
}
/* ===== Floating Animation Pro ===== */

/* الحركة الأساسية */
@keyframes floatUpDown {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-18px); }
  100% { transform: translateY(0px); }
}

/* دوران خفيف */
@keyframes rotateFloat {
  0% { transform: rotate(0deg) translateY(0); }
  50% { transform: rotate(6deg) translateY(-12px); }
  100% { transform: rotate(0deg) translateY(0); }
}

/* الأيقونة الرئيسية */
.hosting-main-icon {
  animation: floatUpDown 5s ease-in-out infinite;
}

/* كل أيقونة عائمة */
.hosting-floating-icon {
  animation: floatUpDown 6s ease-in-out infinite;
}

/* اختلاف لكل أيقونة (مهم جداً يعطي احترافية) */
.icon-cloud {
  animation-duration: 7s;
  animation-delay: 0s;
}

.icon-shield {
  animation-duration: 6s;
  animation-delay: 1s;
}

.icon-plug {
  animation-duration: 5.5s;
  animation-delay: 0.5s;
}

/* تأثير Hover احترافي */
.hosting-floating-icon:hover {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 0 25px 60px rgba(187,48,48,.25);
  transition: 0.3s ease;
}

/* تأثير نبض خفيف */
@keyframes pulseGlow {
  0% { box-shadow: 0 0 0 rgba(187,48,48,0.2); }
  50% { box-shadow: 0 0 25px rgba(187,48,48,0.35); }
  100% { box-shadow: 0 0 0 rgba(187,48,48,0.2); }
}

.hosting-main-icon {
  animation: floatUpDown 5s ease-in-out infinite,
             pulseGlow 4s ease-in-out infinite;
}
.hp-domain-bottom{
  display:flex;
  flex-direction:column;
  align-items:center;  
  gap:14px;
}
.hp-domain-video-sm{
  width:min(600px, 100%);
  display:flex;
  justify-content:center;
}

.hp-domain-video-el{
  width:100%;
  height:auto;
  display:block;
  /* border-radius:12px;  */
}
.hp-text{
  text-align: center;
  font-weight: var(--fw-Text);
}

.hp-feature{
  text-align: center;
}
.hp-feature-text{
  text-align: center;

}
.hp-cta-row{
  display: flex;
  flex-direction: column;  
  align-items: center;      
  text-align: center;
  margin-top: 20px;
}

.compare-box{
  max-width: 1100px;
  margin: 40px auto;
  padding: 0 16px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--SecondaryColor);
}
.compare-header{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  padding: 14px 16px;
  margin-bottom: 14px;

  background: var(--TextBright);
  border: 1px solid #e9edf3;
  border-radius: 14px;

  font-weight: 700;
  font-size: 14px;
  color: var(--SecondaryColor);
}

.compare-header .arrow{
  width: 10px;
  height: 10px;
  border-right: 2px solid #94a3b8;
  border-bottom: 2px solid #94a3b8;
  transform: rotate(45deg);
  flex: 0 0 auto;
}

.compare-box .table-responsive{
  border: 1px solid #e9edf3;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
}

.compare-box table.table{
  margin: 0 !important;
  border: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  font-size: 13px;
}

.compare-box .table-bordered > thead > tr > th,
.compare-box .table-bordered > tbody > tr > th,
.compare-box .table-bordered > tfoot > tr > th,
.compare-box .table-bordered > thead > tr > td,
.compare-box .table-bordered > tbody > tr > td,
.compare-box .table-bordered > tfoot > tr > td{
  border: 0 !important;
}

.compare-box table.table thead th{
  background: #fff;
  padding: 18px 14px;
  vertical-align: bottom;
  border-bottom: 1px solid #e9edf3 !important;
}
.compare-box table.table thead th:first-child{
  width: 38%;
}
.compare-box table.table thead th strong{
  display: block;
  font-size: 13px;
  font-weight: 800;
  color: var(--SecondaryColor);
  line-height: 1.2;
}

.compare-box table.table thead th br{
  content: "";
}

.compare-box table.table tbody td,
.compare-box table.table tbody th{
  padding: 14px 14px;
  border-top: 1px solid #eef2f7 !important;
  vertical-align: middle;
}
.compare-box table.table tbody td:first-child,
.compare-box table.table tbody th:first-child{
  font-weight: 650;
  color: var(--SecondaryColor);
}

.compare-box table.table tbody td:not(:first-child){
  text-align: center;
  font-weight: 650;
  color: var(--SecondaryColor);
}

.compare-box .table-striped > tbody > tr:nth-of-type(odd){
  background: transparent;
}
.compare-box .table-striped > tbody > tr:nth-of-type(even){
  background: #fafbff;
}
.compare-box tr.highlight-row td{
  background: #f6f7ff !important;
}

.compare-box table.table tbody tr:hover td{
  background: #f8fafc !important;
}
.compare-box .check,
.compare-box .fa-check,
.compare-box i.fa.fa-check{
  color: var(--SecondaryColor) !important;
}
.compare-box table.table tbody td .ok,
.compare-box table.table tbody td .tick,
.compare-box table.table tbody td .checkmark{
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--TextBright);
  color: var(--SecondaryColor);
  font-weight: 900;
}

.compare-box .dash{
  color: #94a3b8;
  font-weight: 900;
}

@media (max-width: 860px){
  .compare-box .table-responsive{
    border-radius: 12px;
  }
  .compare-box table.table thead th,
  .compare-box table.table tbody td{
    padding: 12px 10px;
    font-size: 12px;
  }
}
.compare-box table.table thead th{
  display: table-cell !important;
  position: relative;
}

.compare-box table.table thead th:not(:first-child){
  text-align: center !important;
}
.hero-section {
    position: relative;
    height: 480px;
    overflow: hidden;
}

.hero-video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
    z-index: 1;
}

/* .hero-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 2;
} */

.hero-text {
    position: relative;
    z-index: 3;
}

.plans-hero{
  padding: 40px 0 20px;
  background: var(--BackgroundColor);
}

.plans-hero-inner{
  width: min(1100px, 92%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 28px;
  align-items: center;
}

.plans-badge{
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid rgba(0,0,0,.15);
  margin-bottom: 10px;
}

.plans-hero-left h2{
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 8px;
}

.plans-sub{
  margin: 0 0 16px;
  opacity: .8;
}

.plans-points{
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
  display: grid;
  gap: 8px;
}

.plans-cta{
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.plans-note{
  font-size: 13px;
  opacity: .75;
}
.plans-hero-right img{
  width: 100% !important;
  max-width: 600px !important;
  height: auto !important;
  border-radius: 24px;
  display: block;
  margin-left: auto;
}
@media (max-width: 900px){
  .plans-hero-inner{
    grid-template-columns: 1fr !important;
    text-align: center;
  }
  .plans-hero-right img{
    max-width: 320px !important;
    margin: 20px auto 0 !important;
    border-radius: 18px;
  }

  .plans-hero-left{
    text-align: center;
  }

  .plans-hero-left .btn,
  .plans-hero-left .btn-primary{
    margin: 0 auto;
    display: inline-block;
  }
  .plans-wrapper {
        flex-direction: column;
        align-items: stretch;
    }

    .plan-card {
        width: 100%;
    }
}
.plans-trust{
  width: min(1100px, 92%);
  margin: 18px auto 0;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  opacity: .9;
}

.plans-trust .stars{
  letter-spacing: 1px;
}

.plans-trust .dot{
  opacity: .4;
}

@media (max-width: 900px){
  .plans-hero-inner{
    grid-template-columns: 1fr;
  }

  .plans-hero-right img{
    margin: 0 auto;
  }

  .plans-hero-left h2{
    font-size: 28px;
  }
}
.plans-hero-right img{
  border-radius: 24px;
}
.hp-cta-row{
  display: flex !important;
  gap: 14px;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
  flex-wrap: wrap;
}
.hp-cta-row .btn{
  min-width: 180px;
  padding: 14px 0;
  border-radius: 12px;
  font-weight: var(--fw-Buttons);
  text-align: center;
  transition: all .25s ease;
}
.hp-cta-row .btn-primary{
  background: var(--PrimaryColor);
  border: none;
  color: var(--TextBright);
  box-shadow: 0 10px 28px rgba(198,40,40,.35);
} 
/*
.hp-cta-row .btn-primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(198,40,40,.45);
}
*/
.hp-cta-row .btn-default{
  background: transparent;
  border: 2px solid var(--PrimaryColor);
  color: var(--PrimaryColor);
}

.hp-cta-row .btn-default:hover{
  background: var(--PrimaryColor);
  color: var(--TextBright);
  transform: translateY(-2px);
}


.hp-cta-row .btn.btn-outline-light{
  color: var(--BackgroundColor);
  background: transparent;
  border: 1px solid var(--BackgroundColor);
}

.hp-cta-row .btn.btn-outline-light:active{
  background-color: var(--PrimaryColor);   
  color: var(--SecondaryColor);           
  border-color: var(--BackgroundColor);
}
/* ===== Video Section ===== */
/* .hp-video-section{
  position: relative;
  overflow: hidden;
  padding: 120px 0;
} */
.hp-bg-video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.hp-video-overlay{
  position: absolute;
  inset: 0;
  background: linear-gradient(
    rgba(0,0,0,.55),
    rgba(0,0,0,.65)
  );
  z-index: 2;
}
.hp-video-section .hp-section-inner{
  position: relative;
  z-index: 3;
  color: var(--TextBright);
}

.hp-video-section .btn{
  box-shadow: none;
}

.hp-video-section *{
  font-weight: var(--fw-Text);
  color: var(--TextBright) !important;
}

@media (max-width: 900px){
  .hp-video-section{
    padding: 80px 0;
  }

  .hp-bg-video{
    height: 100%;
  }
}

/* .hp-video-section::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:120px;
  background: linear-gradient(to bottom, transparent, var(--TextBright));
  z-index:3;
} */
.hp-video-section{
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}


section.hp-section.hp-webhosting{
  padding: 80px 0;
  background: var(--BackgroundColor);
}

section.hp-section.hp-webhosting .hp-section-inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}


section.hp-section.hp-webhosting .hp-section-header{
  text-align: center;
  margin-bottom: 30px;
}

section.hp-section.hp-webhosting .hp-section-title{
  font-size: 32px;
  font-weight: var(--fw-Subtitle);
  margin-bottom: 10px;
  color: var(--TextDark);
}

section.hp-section.hp-webhosting .hp-section-subtitle{
  max-width: 720px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: var(--fw-Text);
  line-height: 1.8;
  color: var(--TextDark);
}


section.hp-section.hp-webhosting .hp-webhosting-grid{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 40px;
  align-items: center;

  background: var(--BackgroundColor);
  border-radius: 18px;
  padding: 36px;
  box-shadow: 0 18px 40px rgba(0,0,0,.08);
}
section.hp-section.hp-webhosting .hp-webhosting-text{
  color: var(--TextDark);
}

section.hp-section.hp-webhosting .hp-webhosting-text p{
  font-size: 15px;
  font-weight: var(--fw-Text);
  line-height: 1.9;
  margin-bottom: 18px;
  color: var(--TextDark);
}
section.hp-section.hp-webhosting .hp-webhosting-features{
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
}

section.hp-section.hp-webhosting .hp-webhosting-features li{
  padding: 10px 14px;
  margin-bottom: 10px;
  border-radius: 10px;
  background: var(--BackgroundColor);
  border: 1px solid var(--BackgroundColor);
  font-size: 14px;
  font-weight: var(--fw-Text);
  display: flex;
  align-items: center;
  gap: 10px;
}
section.hp-section.hp-webhosting .hp-webhosting-text .btn,
section.hp-section.hp-webhosting .hp-webhosting-text a{
  display: inline-block;
  padding: 12px 26px;
  border-radius: 12px;
  background: var(--PrimaryColor);
  color: var(--TextBright);
  font-weight: var(--fw-Buttons);
  text-decoration: none;
  box-shadow: 0 14px 26px rgba(44,128,255,.25);
}
/*
section.hp-section.hp-webhosting .hp-webhosting-text .btn:hover{
  filter: brightness(1.05);
}
  */
section.hp-section.hp-webhosting .hp-webhosting-media img{
  width: 100%;
  max-width: 380px;
  display: block;
  margin: 0 auto;
}
@media (max-width: 768px){

  section.hp-section.hp-webhosting .hp-section-inner{
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  section.hp-section.hp-webhosting .hp-webhosting-grid{
    width: 100% !important;
  }

}
@media (max-width: 768px){

  
  section.hp-section.hp-webhosting .hp-webhosting-cta .btn.btn-primary{
    width: auto !important;
    max-width: 100% !important;
    display: inline-flex !important;   
    padding: 4px 10px !important;     
  }

}
section.hp-section.hp-webhosting .hp-webhosting-features li{
  position: relative;
  padding-left: 46px;
}
section.hp-section.hp-webhosting .hp-webhosting-features li::before{
  content: "✓";
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);

  width: 22px;
  height: 22px;
  border-radius: 50%;

  display: flex;
  align-items: center;
  justify-content: center;

  background: var(--PrimaryColor);
  color: var(--TextBright);
  font-size: 13px;
  font-weight: 700;
}

/* ===== Domain section: full width + centered premium card (no structure breaking) ===== */

section.hp-section.hp-domain{
  width: 100%;
  padding: 90px 0;
  background: var(--PrimaryColor);
}

section.hp-section.hp-domain .hp-section-inner{
  max-width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

section.hp-section.hp-domain .hp-section-header{
  text-align: center;
  margin-bottom: 34px;
}
section.hp-section.hp-domain .hp-section-title{
  margin: 0 0 12px;
  font-size: 38px;
  font-weight: var(--fw-Subtitle);
  line-height: 1.15;
  color: var(--TextDark);
}
section.hp-section.hp-domain .hp-section-subtitle{
  margin: 0 auto;
  max-width: 760px;
  font-size: 16px;
  font-weight:var(--fw-Text) ;
  line-height: 1.9;
  color: var(--TextDark);
}

section.hp-section.hp-domain .hp-split{
  max-width: 1100px;
  margin: 0 auto;
  background: var(--BackgroundColor);
  border: 1px solid var(--BackgroundColor);
  border-radius: 18px;
  box-shadow: 0 22px 60px rgba(10,20,60,.10);
  padding: 34px;
}
section.hp-section.hp-domain .hp-split{
  display: flex;
  gap: 28px;
  align-items: center;
}
section.hp-section.hp-domain .hp-card{
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  width: 100%;
}

section.hp-section.hp-domain .hp-card.hp-domain-left{
  flex: 1.1;
}
section.hp-section.hp-domain .hp-card:not(.hp-domain-left){
  flex: .9;
}
section.hp-section.hp-domain input,
section.hp-section.hp-domain select{
  width: 100%;
  height: 54px;
  padding: 0 16px;
  border: 1px solid var(--BackgroundColor);
  border-radius: 12px;
  background: var(--BackgroundColor);
}
section.hp-section.hp-domain input:focus{
  outline: none;
  border-color: var(--SecondaryColor);
  box-shadow: 0 0 0 4px rgba(44,128,255,.12);
}
section.hp-section.hp-domain button,
section.hp-section.hp-domain .btn,
section.hp-section.hp-domain input[type="submit"]{
  background: var(--PrimaryColor);   
}
/*
section.hp-section.hp-domain button:hover,
section.hp-section.hp-domain .btn:hover,
section.hp-section.hp-domain input[type="submit"]:hover{
  filter: brightness(1.05);
}
*/
section.hp-section.hp-domain .hp-domain-left input,
section.hp-section.hp-domain .hp-domain-left select{
  margin: 10px 0;
}
section.hp-section.hp-domain a.btn.btn-default{
  margin-top: 10px;
  font-weight: var(--fw-Buttons);
  width: 100%;
  background-color: var(--PrimaryColor) !important;
  color: var(--TextBright)  !important ;
  border: none !important;
}

@media (max-width: 768px){

  /* section.hp-section{
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  } */

  /* section.hp-section .hp-section-inner{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  html, body{
    overflow-x: hidden;
  } */
}

/*
header.header .cart-btn .badge {
  display: none !important;
}
header.header a.btn.nav-link.cart-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  min-width: 46px;
  padding: 0 14px;
  border-radius: 999px;
  background:var(--PrimaryColor);
  border: 1px solid rgba(255,255,255,.25);
  color: var(--PrimaryColor);
  backdrop-filter: blur(6px);
  transition: transform .15s ease, background-color .2s ease, box-shadow .2s ease;
}
header.header a.btn.nav-link.cart-btn:hover {
  transform: translateY(-1px);
  background:var(--PrimaryColor);
  text-decoration: none;
}
header.header a.btn.nav-link.cart-btn i,
header.header a.btn.nav-link.cart-btn svg {
  font-size: 19px;
  width: 19px;
  height: 19px;
  color: var(--BackgroundColor);
  opacity: .95;
}


header.header .lang-btn{
  width: 200px;              
  height: 36px;             
  margin-right: 12px;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex: 0 0 200px !important;
  white-space: nowrap;
  overflow: hidden;
}
html[dir="rtl"] header.header .lang-btn{
  margin-right: 0;
  margin-left: 12px;
}
header.header .lang-btn > *{
  flex: 0 0 auto;
}
header.header .lang-btn i,
header.header .lang-btn svg{
  display: none !important;
}
header.header .lang-btn::before{
  content: "EN  |  AR";
  display: inline-block;
  width: 80px;          
  text-align: center;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: .6px;
  color: var(--PrimaryColor);
}
/*
header.header .dropdown-menu,
#main-menu .dropdown-menu,
.navbar .dropdown-menu {
  background-color:var(--SecondaryColor)!important;
  border: 1px solid var(--SecondaryColor) !important;
  border-radius: 12px !important;
  padding: 8px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,0.22) !important;
}

.navbar .dropdown-menu .dropdown-item,
.navbar .dropdown-menu a {
  color: rgba(255,255,255,.92) !important;
  background: transparent !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  transition: background-color .15s ease, color .15s ease, transform .12s ease;
}
.navbar .dropdown-menu a.active,
.navbar .dropdown-menu a:active {
  background-color: var(--PrimaryColor) !important; 
  color: var(--TextBright) !important;
}
header.header .dropdown-divider,
#main-menu .dropdown-divider,
.navbar .dropdown-divider {
  border-top: 1px solid rgba(255,255,255,.10) !important;
}
*/

/* =========================================
   Domain Search (Twenty-One) -> Hero Look
   Targets: .home-domain-search / #frmDomainHomepage
========================================= */

/* 1) Block in den Hero "hochziehen" (optional) */
/* #frmDomainHomepage {
  position: relative;
  z-index: 20;
  margin-top: 0px;
} */

/* 2) Hintergrund & Spacing neutralisieren */
#frmDomainHomepage .home-domain-search {
  background: transparent !important;
}

#frmDomainHomepage .home-domain-search .container {
  display: flex;
  justify-content: center;
}


#frmDomainHomepage .home-domain-search .p-5 {
  width: 100%;
  max-width: 820px;
  background: transparent !important;
  padding: 0 !important;
}

#frmDomainHomepage .input-group-wrapper {
  width: 100%;
  border: 0px;
  background-color: var(--BackgroundColor);
}

#frmDomainHomepage .input-group {
  background: var(--BackgroundColor);
  border-radius: 999px;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(0,0,0,0.25);
  border: 3px solid var(--BackgroundColor);
}

/* 4) Input */
#frmDomainHomepage .input-group .form-control {
  height: 40px;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding-left: 22px;
  font-size: 16px;
  color: var(--TextDark) !important;
}

#frmDomainHomepage #btnDomainSearch {
  height: 40px;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 15px;
  font-weight: var(--fw-Buttons);
  background: var(--PrimaryColor) !important;
  color: var(--TextBright) !important;
}


#frmDomainHomepage #btnTransfer {
  height: 40px;
  border: 0 !important;
  border-radius: 0 999px 999px 0 !important;
  padding: 0 15px;
  font-weight: var(--fw-Buttons);
  background: var(--SecondaryColor) !important;
  color: var(--TextBright) !important;
}


#frmDomainHomepage #btnDomainSearch:hover,
#frmDomainHomepage #btnTransfer:hover {
  filter: brightness(0.92);
  transform: translateY(-1px);
}


#frmDomainHomepage #btnDomainSearch2,
#frmDomainHomepage #btnTransfer2 {
  height: 52px;
  border-radius: 999px !important;
  border: 0 !important;
  font-weight: 800;
}

#frmDomainHomepage #btnDomainSearch2 {
  background: var(--PrimaryColor) !important;
  color: var(--TextBright) !important;
}

#frmDomainHomepage #btnTransfer2 {
  background: var(--SecondaryColor) !important;
  color: var(--TextBright) !important;
}

body > p[style*="text-align:center"] {
  display: none !important;
}


#frmDomainHomepage .p-5.clearfix{
  text-align: center;
}

#frmDomainHomepage a.btn.btn-link.btn-sm.float-right{
  float: none !important;            
  display: inline-flex !important;  
  align-items: center;
  justify-content: center;

      
  padding: 10px 22px !important;

  background: var(--PrimaryColor) !important;     
  color: var(--TextBright) !important;

  border: 0 !important;
  border-radius: 12px;   
  text-decoration: none !important;

  font-size: 15px !important;
  font-weight: var(--fw-Buttons) !important;

  box-shadow: 0 10px 22px rgba(197, 48, 48, 0.28) !important;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
#frmDomainHomepage a.btn.btn-link.btn-sm.float-right:active{
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(197, 48, 48, 0.24) !important;
}
#frmDomainHomepage a.btn.btn-link.btn-sm.float-right{
  -webkit-tap-highlight-color: transparent !important;
}

@media (max-width: 768px) {
    #frmDomainHomepage a.btn.btn-link.btn-sm {
        margin-top: 20px !important; 
        display: block !important;
        text-align: center; 
    }
}





.navbar-nav.toolbar > li.nav-item.ml-3 {
  display: flex;
  align-items: center;
}

.cart-btn {
  border-width: 0px !important;
}

.cart-btn i {
  color: var(--PrimaryColor);
}

.cart-btn i:hover {
  color: var(--SecondaryColor);
  transform: translateY(-2px);
}

.btn.header-locale-btn {
  color: var(--TextDark) !important;
}

.btn.header-locale-btn:hover {
  color: var(--PrimaryColor) !important;
  transform: translateY(-2px);
}

.logo-img{
  max-height: 25px !important;
}

.navbar-light{
  padding-top: 2px;
  padding-bottom: 2px;
}

@media (max-width: 485px) {
  .navbar-light {
    padding-right: 2px;
    padding-left: 2px;
  }
  .logo-img {
    max-height: 17px !important;
  }
  .cart-btn {
    padding-bottom: 0px !important;
  }

  .cart-btn .badge {
    font-size: 7px !important;
  }

  .btn.header-locale-btn {
    padding-left: 2px;
    padding-right: 2px;
    padding-bottom: 0px;
    font-size: 13px !important;
    color: var(--TextDark);
  }
  .btn.nav-link {
    padding-right :4px !important;
    padding-left :4px !important;
  }
  .fas.fa-bars.fa-fw{
    color:var(--TextDark);
  }

  .fas.fa-bars.fa-fw:hover {
    color:var(--PrimaryColor);
    transform: translateY(-2px);
  }
}
/* #####################
          Test
   #####################*/
.hp-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-top: 40px;
}

.hp-feature-card {
    background: rgba(255,255,255,0.08);
    backdrop-filter: blur(8px);
    border-radius: 16px;
    padding: 28px;
    text-align: center;
    color: var(--TextBright);
    transition: transform .2s ease, background .2s ease;
}

.hp-feature-card h3 {
    margin-bottom: 8px;
    font-size: 18px;
}

.hp-feature-card p {
    opacity: 0.85;
    font-size: 14px;
}

.hp-feature-media{
  padding-bottom: 20px;
}

@media (max-width: 768px) {
    .hp-feature-grid {
        grid-template-columns: 1fr;
    }
}

/* #####################
        End Test
   #####################*/
/*بداية تنسيق شريط المعلومات المتحرك*/
.sy-floating-alert {
  position: fixed;
  top: px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 48px);
  max-width: 1120px;
  z-index: 99999;

  direction: rtl;
  display: flex;
  align-items: center;
  gap: 14px;

  padding: 14px 18px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(220, 38, 38, 0.22);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.16);

  color: #7f1d1d;
  animation: syAlertIn .45s ease;
}

.sy-floating-alert.is-en {
  direction: ltr;
}

.sy-alert-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #ef4444, #f97316);
  color: #fff;
  font-size: 25px;
  font-weight: 900;
  box-shadow: 0 12px 26px rgba(239, 68, 68, .28);
}

.sy-alert-content {
  flex: 1;
  min-width: 0;
}

.sy-alert-content strong {
  display: block;
  font-size: 15px;
  font-weight: 900;
  margin-bottom: 3px;
  color: #7f1d1d;
}

.sy-alert-content p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.7;
  color: #991b1b;
}

.sy-alert-action {
  flex-shrink: 0;
  padding: 8px 15px;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 800;
}

.sy-alert-action:hover {
  background: #b91c1c;
  color: #fff;
}

.sy-alert-close {
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 12px;
  background: #fff1f2;
  color: #991b1b;
  font-size: 23px;
  cursor: pointer;
}

.sy-alert-close:hover {
  background: #fee2e2;
}

.sy-floating-alert.is-hidden {
  animation: syAlertOut .35s ease forwards;
}

/* الجرس */
.sy-alert-bell {
  display: none;
  position: fixed;
  top: 26px;
  inset-inline-end: 28px;
  z-index: 99999;

  width: 54px;
  height: 54px;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, #dc2626, #f97316);
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  box-shadow: 0 18px 40px rgba(220, 38, 38, .35);
  animation: bellShake 1.4s infinite ease-in-out;
}

.sy-alert-bell span {
  position: absolute;
  top: 8px;
  inset-inline-end: 8px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255,255,255,.25);
}

@keyframes syAlertIn {
  from {
    opacity: 0;
    transform: translate(-50%, -22px);
  }
  to {
    opacity: 1;
    transform: translate(-50%, 0);
  }
}

@keyframes syAlertOut {
  to {
    opacity: 0;
    transform: translate(-50%, -22px) scale(.98);
    pointer-events: none;
  }
}

@keyframes bellShake {
  0%, 100% { transform: rotate(0deg); }
  15% { transform: rotate(12deg); }
  30% { transform: rotate(-10deg); }
  45% { transform: rotate(8deg); }
  60% { transform: rotate(-6deg); }
  75% { transform: rotate(3deg); }
}

@media (max-width: 768px) {
  .sy-floating-alert {
    top: 12px;
    width: calc(100% - 20px);
    flex-wrap: wrap;
    padding: 14px;
  }

  .sy-alert-content {
    flex: 1 1 calc(100% - 56px);
  }

  .sy-alert-action {
    width: 100%;
    text-align: center;
  }

  .sy-alert-bell {
    top: 14px;
    inset-inline-end: 14px;
  }
}
/*نهاية تنسيق شريط المعلومات المتحرك*/
/* بداية تنسيق بطاقات ssl-section الصفحة الرئيسية */


.pro-ssl-section {
  padding: 100px 20px;
   background: transparent;

   
}

.pro-ssl-container {
  max-width: 1150px;
  margin: auto;
}

/* Header */
.pro-ssl-header {
  text-align: center;
  margin-bottom: 60px;
}

.pro-ssl-badge {
  display: inline-block;
  background: rgba(187,48,48,.1);
  color: #bb3030;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  margin-bottom: 10px;
}

.pro-ssl-title {
  font-size: 42px;
  font-weight: 900;
  color: #162b3a;
}

.pro-ssl-description {
  color: #64748b;
  margin-top: 10px;
}

/* Grid */
.pro-ssl-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 28px;
}

/* Card */
.pro-ssl-card {
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(10px);
  border-radius: 22px;
  padding: 35px;
  text-align: center;
  box-shadow: 0 20px 50px rgba(0,0,0,.07);
  transition: .35s ease;
}

.pro-ssl-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 30px 70px rgba(0,0,0,.12);
}


/* Icon */
.pro-ssl-icon {
  width: 70px;
  height: 70px;
  margin: auto;
  border-radius: 50%;
  background: rgba(187,48,48,.1);
  color: #bb3030;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  margin-bottom: 18px;
  transition: .3s;
}

/* Floating Animation */
@keyframes floatSoft {
  0% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0); }
}

.pro-ssl-card:nth-child(1) .pro-ssl-icon {
  animation: floatSoft 4s infinite ease-in-out;
}

.pro-ssl-card:nth-child(2) .pro-ssl-icon {
  animation: floatSoft 5s infinite ease-in-out;
}

.pro-ssl-card:nth-child(3) .pro-ssl-icon {
  animation: floatSoft 4.5s infinite ease-in-out;
}

/* Hover */
.pro-ssl-card:hover .pro-ssl-icon {
  transform: scale(1.2);
  box-shadow: 0 15px 40px rgba(187,48,48,.3);
}

/* Text */
.pro-ssl-card h3 {
  margin-bottom: 10px;
  color: #1c2b36;
}

.pro-ssl-card p {
  color: #6b7b88;
}

/* Button */
.pro-ssl-button-wrap {
    display: flex;
    justify-content: center;
    margin-top: 24px;
}

.pro-ssl-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 15px 34px;
    border-radius: 999px;
    background: linear-gradient(135deg, #bb3030, #c92f35);
    color: #fff !important;
    font-size: 16px;
    font-weight: 800;
    text-decoration: none !important;
    box-shadow: 0 18px 35px rgba(201, 47, 53, 0.28);
    border: 1px solid rgba(255,255,255,.35);
    transition: all .28s ease;
}

.pro-ssl-button i {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255,255,255,.18);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: all .28s ease;
}

.pro-ssl-button:hover {
    color: #fff !important;
    transform: translateY(-4px);
    box-shadow: 0 22px 42px rgba(201, 47, 53, 0.38);
    background: linear-gradient(135deg, #ff3b42, #b91c1c);
}

.pro-ssl-button:hover i {
    transform: translateX(-4px);
    background: rgba(255,255,255,.26);
}

@media (max-width: 576px) {
    .pro-ssl-button {
        width: 100%;
        max-width: 320px;
    }
}

/* Responsive */
@media (max-width: 576px) {
    .pro-ssl-button {
        width: 100%;
        justify-content: space-between;
    }
}

/* Responsive */
@media(max-width: 900px){
  .pro-ssl-grid {
    grid-template-columns: 1fr;
  }

  .pro-ssl-card.featured {
    transform: none;
  }
}


/* نهاية تنسيق بطاقات ssl-section الصفحة الرئيسية */




/* بداية تنسيق بطاقات SSL الصفحة الرئيسية */

.ultra-ssl-section {
  padding: 120px 20px;
  background: #F7F7F9
}

.ultra-ssl-container {
  max-width: 1200px;
  margin: auto;
}

/* Header */
.ultra-ssl-header {
  text-align: center;
  margin-bottom: 70px;
}

.ultra-badge {
  display: inline-block;
  background: rgba(187,48,48,.1);
  color: #bb3030;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
  margin-bottom: 10px;
}

.ultra-ssl-header h2 {
  font-size: 42px;
  font-weight: 900;
  color: #1c2b36;
}

.ultra-ssl-header p {
  color: #6b7b88;
  margin-top: 10px;
}

/* Grid */
.ultra-ssl-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 30px;
}

/* Card */
.ultra-ssl-card {
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(12px);
  padding: 35px;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0,0,0,.05);
  transition: 0.35s;
  position: relative;
}

.ultra-ssl-card:hover {
  transform: translateY(-12px);
  box-shadow: 0 30px 70px rgba(0,0,0,.12);
}

/* Featured */
.ultra-ssl-card.featured {
  border: 2px solid #bb3030;
  transform: scale(1.05);
  background: #fff;
}

.ssl-popular {
  position: absolute;
  top: -12px;
  right: 20px;
  background: #bb3030;
  color: #fff;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 12px;
}

/* Icon */
/* ===== Floating Professional Icons ===== */

.ssl-icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(187,48,48,.12), rgba(187,48,48,.05));
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  position: relative;
  transition: 0.3s ease;
}

.ssl-icon i {
  font-size: 28px;
  color: #bb3030;
}

/* حركة عائمة ناعمة */
@keyframes floatSmooth {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

/* اختلاف لكل كرت (احتراف) */
.ultra-ssl-card:nth-child(1) .ssl-icon i {
  animation: floatSmooth 4s ease-in-out infinite;
}

.ultra-ssl-card:nth-child(2) .ssl-icon i {
  animation: floatSmooth 5s ease-in-out infinite;
}

.ultra-ssl-card:nth-child(3) .ssl-icon i {
  animation: floatSmooth 4.5s ease-in-out infinite;
}

/* Glow للكرت المميز */
.ultra-ssl-card.featured .ssl-icon {
  box-shadow: 0 0 25px rgba(187,48,48,.25);
}

/* Hover احترافي */
.ultra-ssl-card:hover .ssl-icon {
  transform: scale(1.15);
  box-shadow: 0 20px 50px rgba(187,48,48,.3);
}

.ultra-ssl-card:hover .ssl-icon i {
  transform: rotate(8deg);
  transition: 0.3s;
}

/* Badge */
.ssl-popular {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #bb3030;
  color: #fff;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 13px;
}

.ssl-popular i {
  animation: floatSmooth 3s infinite;
}


/* Text */
.ssl-sub {
  color: #6b7b88;
  margin-bottom: 15px;
}

.ultra-ssl-card ul {
  list-style: none;
  padding: 0;
  margin: 20px 0;
}

.ultra-ssl-card ul li {
  margin-bottom: 10px;
  color: #2b3c48;
}

.ultra-ssl-card ul li::before {
  content: "✔";
  color: #bb3030;
  margin-left: 8px;
}

/* Button */
.ssl-btn {
  display: block;
  text-align: center;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid #ddd;
  color: #333;
  text-decoration: none;
  transition: 0.3s;
}

.ssl-btn:hover {
  background: #f3f6f9;
}

.ssl-btn.primary {
  background: #bb3030;
  color: #fff;
  border: none;
}

.ssl-btn.primary:hover {
  background: #a12828;
}

/* Responsive */
@media(max-width: 900px){
  .ultra-ssl-grid {
    grid-template-columns: 1fr;
  }
}
/* نهاية تنسيق بطاقات SSL الصفحة الرئيسية */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

#main-body {
    flex: 1 0 auto;
}

.site-footer {
    margin-top: auto;
    flex-shrink: 0;
}
/* ===== Payment Methods Modern Design ===== */

.payment-section {
  padding: 80px 20px;
  background: linear-gradient(180deg, #f8fbfd 0%, #eef4f8 100%);
  text-align: center;
}

.payment-header h2 {
  font-size: 46px;
  font-weight: 800;
  color: #172b3a;
}

.payment-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 15px;
  margin: 20px 0;
}

.payment-divider span {
  width: 100px;
  height: 2px;
  background: #39c58a;
}

.payment-shield {
  border: 2px solid #39c58a;
  border-radius: 50%;
  padding: 5px 10px;
  color: #39c58a;
  font-weight: bold;
}

.payment-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 20px;
  margin-top: 40px;
}

.payment-card {
  background: #fff;
  padding: 35px 15px;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.08);
  transition: 0.3s;
}

.payment-card:hover {
  transform: translateY(-6px);
}

.payment-icon {
  width: 80px;
  height: 80px;
  margin: auto;
  border-radius: 50%;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: bold;
}

.payment-line {
  width: 40px;
  height: 3px;
  background: #39c58a;
  margin: 15px auto;
}

.payment-card h3 {
  font-size: 14px;
  font-weight: 700;
}

/* ألوان */
.paypal-icon { color: #0070ba; }
.usd-icon, .syp-icon { color: #16a34a; border: 2px solid #16a34a; }
.eur-icon { color: #2563eb; border: 2px solid #2563eb; }
.bank-icon { font-size: 32px; }

/* موبايل */
@media (max-width: 992px) {
  .payment-grid { grid-template-columns: repeat(3,1fr); }
}

@media (max-width: 600px) {
  .payment-grid { grid-template-columns: repeat(2,1fr); }
}
/* ===== تحسين احترافي ===== */

.payment-card {
  background: #ffffff;
  padding: 40px 18px;
  border-radius: 20px;
  box-shadow: 0 15px 45px rgba(0,0,0,0.08);
  transition: all 0.35s ease;
  position: relative;
  overflow: hidden;
}

.payment-card:hover {
  transform: translateY(-10px) scale(1.03);
  box-shadow: 0 25px 60px rgba(0,0,0,0.15);
}

/* تحسين الأيقونات */
.payment-icon {
  width: 85px;
  height: 85px;
  margin: auto;
  border-radius: 50%;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  font-weight: bold;
  transition: 0.3s;
}

/* ألوان واضحة */
.paypal-icon { color: #0070ba; }

.usd-icon {
  color: #16a34a;
  border: 2px solid #16a34a;
}

.eur-icon {
  color: #2563eb;
  border: 2px solid #2563eb;
}

.syp-icon {
  color: #16a34a;
  border: 2px solid #16a34a;
}

.bank-icon {
  font-size: 34px;
  color: #1e3a8a;
}

/* 🔥 إصلاح MasterCard */
.mastercard-icon {
  position: relative;
}

.mastercard-icon span {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: inline-block;
}

.mastercard-icon span:first-child {
  background: #eb001b;
  margin-right: -12px;
}

.mastercard-icon span:last-child {
  background: #f79e1b;
}

/* خط أخضر */
.payment-line {
  width: 45px;
  height: 3px;
  background: linear-gradient(90deg, #22c55e, #4ade80);
  margin: 15px auto;
  border-radius: 10px;
}

/* النص السفلي */
.payment-note {
  margin-top: 60px;
  font-size: 16px;
  color: #475569;
}

.payment-note span {
  color: #22c55e;
  font-weight: bold;
  margin-right: 8px;
}

/* تحسين الخلفية */
.payment-section {
  background: #F7F7F9
}
.payment-note {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 55px;
  padding: 12px 22px;
  background: rgba(255,255,255,.7);
  border: 1px solid rgba(57,197,138,.25);
  border-radius: 999px;
  color: #425466;
  font-size: 15px;
}

.payment-note span {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #22c55e;
  border: 1px solid #22c55e;
  border-radius: 50%;
  margin: 0;
}
/* ===== بداية قسم الاسئله الشائعة ===== */

.premium-faq-section {
  padding: 90px 20px;
  background: linear-gradient(180deg, #f8fbfd 0%, #eef4f8 100%);
}

.premium-faq-container {
  max-width: 1100px;
  margin: auto;
}

.premium-faq-header {
  text-align: center;
  margin-bottom: 45px;
}

.premium-faq-header h2 {
  font-size: 48px;
  font-weight: 800;
  color: #162b3a;
  margin-bottom: 18px;
}

.premium-faq-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-bottom: 22px;
}

.premium-faq-divider span {
  width: 140px;
  height: 2px;
  background: #bb3030;
}

.premium-faq-mark {
  width: 44px;
  height: 44px;
  border: 2px solid #bb3030;
  border-radius: 50%;
  color: #bb3030;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 800;
}

.premium-faq-header p {
  color: #64748b;
  font-size: 19px;
  max-width: 700px;
  margin: 0 auto;   /* هذا هو الحل */
  text-align: center;
  line-height: 1.8;
}
.premium-faq-header {
  text-align: center;
  margin-bottom: 60px;
}

.premium-faq-header h2 {
  text-align: center;
  letter-spacing: -0.5px;
}

.premium-faq-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.premium-faq-item {
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(187,48,48,0.08);
  border-radius: 26px;
  padding: 28px;
  box-shadow: 0 20px 55px rgba(20,45,70,0.08);
  transition: 0.3s ease;
}

.premium-faq-item:hover {
  transform: translateY(-5px);
  box-shadow: 0 28px 70px rgba(20,45,70,0.13);
}

.premium-faq-item summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 90px 1fr 46px;
  gap: 28px;
  align-items: center;
}

.premium-faq-item summary::-webkit-details-marker {
  display: none;
}

.premium-faq-icon {
  width: 90px;
  height: 90px;
  border-radius: 22px;
  background: rgba(187,48,48,0.08);
  color: #bb3030;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
}

.premium-faq-item summary strong {
  color: #162b3a;
  font-size: 22px;
  font-weight: 800;
}

.premium-faq-item[open] summary strong {
  color: #bb3030;
}

.premium-faq-toggle {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 2px solid rgba(187,48,48,0.25);
  color: #bb3030;
  display: flex;
  align-items: center;
  justify-content: center;
}

.premium-faq-toggle::before {
  content: "+";
  font-size: 26px;
  font-weight: 700;
}

.premium-faq-item[open] .premium-faq-toggle {
  background: linear-gradient(135deg, #bb3030, #d84a4a);
  color: #fff;
  border-color: transparent;
}

.premium-faq-item[open] .premium-faq-toggle::before {
  content: "−";
}

.premium-faq-answer {
  margin-top: 24px;
  margin-right: 118px;
  padding: 24px 28px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(187,48,48,0.08), rgba(255,255,255,0.85));
  border: 1px solid rgba(187,48,48,0.12);
  color: #64748b;
  font-size: 17px;
  line-height: 1.9;
}

@media (max-width: 768px) {
  .premium-faq-header h2 {
    font-size: 34px;
  }

  .premium-faq-item summary {
    grid-template-columns: 64px 1fr 40px;
    gap: 14px;
  }

  .premium-faq-icon {
    width: 64px;
    height: 64px;
    font-size: 26px;
  }

  .premium-faq-item summary strong {
    font-size: 17px;
  }

  .premium-faq-answer {
    margin-right: 0;
    font-size: 15px;
  }
}

/* ===== PRO TESTIMONIALS SLIDER ===== */

.pro-testimonials-section {
  padding: 90px 20px;
  background:
    radial-gradient(circle at top, rgba(187,48,48,.08), transparent 35%),
    linear-gradient(180deg, #f8fbfd 0%, #eef4f8 100%);
  overflow: hidden;
}

.pro-testimonials-container {
  max-width: 1280px;
  margin: auto;
}

.pro-testimonials-header {
  text-align: center;
  margin-bottom: 60px;
}

.pro-eyebrow {
  color: #bb3030;
  font-weight: 800;
  margin-bottom: 12px;
}

.pro-eyebrow i {
  margin-left: 6px;
}

.pro-testimonials-header h2 {
  font-size: 52px;
  font-weight: 900;
  color: #162b3a;
  margin: 0 0 14px;
}

.pro-testimonials-header p {
  max-width: 760px;
  margin: auto;
  color: #64748b;
  font-size: 18px;
  line-height: 1.8;
}

.pro-title-line {
  width: 72px;
  height: 4px;
  background: #bb3030;
  border-radius: 30px;
  margin: 26px auto 0;
}

.pro-slider-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 22px;
}

.pro-testimonials-slider {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1.35fr 1fr;
  gap: 30px;
  align-items: center;
}

.pro-testimonial-card {
  position: relative;
  min-height: 390px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(187,48,48,.10);
  border-radius: 30px;
  padding: 34px;
  box-shadow: 0 28px 70px rgba(20,45,70,.09);
  overflow: hidden;
  transition: .35s ease;
  text-align: left;
  direction: ltr;
}

.pro-testimonial-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 38px 90px rgba(20,45,70,.14);
}

.pro-featured {
  min-height: 450px;
  border-color: rgba(187,48,48,.28);
  box-shadow: 0 38px 95px rgba(187,48,48,.14);
}

.pro-center-badge {
  position: absolute;
  top: -24px;
  left: 50%;
  transform: translateX(-50%);
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: linear-gradient(135deg, #bb3030, #dc4545);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 16px 35px rgba(187,48,48,.28);
  font-size: 22px;
}

.pro-quote {
  position: absolute;
  top: 14px;
  right: 26px;
  font-size: 100px;
  color: rgba(187,48,48,.12);
  font-weight: 900;
  line-height: 1;
}

.pro-client {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 26px;
  position: relative;
  z-index: 2;
}

.pro-avatar {
  position: relative;
  width: 70px;
  height: 70px;
  min-width: 70px;
  border-radius: 50%;
  background: linear-gradient(135deg, #bb3030, #e24a4a);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 21px;
  font-weight: 900;
  box-shadow: 0 14px 34px rgba(187,48,48,.25);
}

.pro-avatar span {
  position: absolute;
  bottom: -2px;
  left: -3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #16c784;
  color: #fff;
  border: 3px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
}

.pro-client h3 {
  margin: 0;
  color: #162b3a;
  font-size: 23px;
  font-weight: 900;
  line-height: 1.25;
}

.pro-client small {
  color: #748194;
  font-size: 15px;
}

.pro-stars {
  color: #bb3030;
  font-size: 20px;
  letter-spacing: 4px;
  margin-bottom: 22px;
  position: relative;
  z-index: 2;
}

.pro-rating-row {
  display: flex;
  align-items: center;
  gap: 14px;
}

.pro-verified {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(187,48,48,.08);
  color: #bb3030;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  margin-bottom: 22px;
}

.pro-testimonial-card p {
  color: #425466;
  font-size: 17px;
  line-height: 1.85;
  margin: 0;
  position: relative;
  z-index: 2;
}

.pro-footer {
  margin-top: 26px;
  padding-top: 20px;
  border-top: 1px solid rgba(20,45,70,.08);
}

.pro-footer span {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: #64748b;
  background: #f8fafc;
  padding: 10px 16px;
  border-radius: 14px;
  font-size: 14px;
}

.pro-footer i {
  color: #bb3030;
}

.pro-slider-btn {
  width: 46px;
  height: 46px;
  min-width: 46px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #162b3a;
  box-shadow: 0 14px 34px rgba(20,45,70,.12);
  cursor: pointer;
  transition: .3s ease;
}

.pro-slider-btn:hover {
  background: #bb3030;
  color: #fff;
  transform: translateY(-3px);
}

.pro-slider-dots {
  display: flex;
  justify-content: center;
  gap: 9px;
  margin-top: 34px;
}

.pro-slider-dots span {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: rgba(187,48,48,.18);
}

.pro-slider-dots span.active {
  width: 25px;
  border-radius: 20px;
  background: #bb3030;
}

@media (max-width: 1100px) {
  .pro-testimonials-slider {
    grid-template-columns: 1fr;
  }

  .pro-testimonial-card,
  .pro-featured {
    max-width: 720px;
    width: 100%;
    min-height: auto;
    margin: auto;
  }

  .pro-slider-btn {
    display: none;
  }
}

@media (max-width: 600px) {
  .pro-testimonials-section {
    padding: 70px 16px;
  }

  .pro-testimonials-header h2 {
    font-size: 34px;
  }

  .pro-testimonial-card {
    padding: 26px;
    border-radius: 24px;
  }

  .pro-client h3 {
    font-size: 19px;
  }

  .pro-testimonial-card p {
    font-size: 15px;
  }
}
/*تنسيق الهيدر*/

.hz-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    direction: rtl;
    font-family: "Cairo", sans-serif;
    background:
        radial-gradient(circle at 30% 0%, rgba(201,47,53,.12), transparent 34%),
        linear-gradient(135deg, #071f27 0%, #13232f 100%);
    border-bottom: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 18px 45px rgba(0,0,0,.22);
}

.hz-inner {
    min-height: 96px;
    display: flex;
    align-items: center;
    gap: 28px;
}

.hz-logo {
    order: 1;
    margin-left: 40px;
    text-decoration: none !important;
    flex-shrink: 0;
}

.hz-logo img {
    max-height: 54px;
    width: auto;
    display: block;
}

.hz-logo span {
    font-size: 38px;
    font-weight: 900;
    letter-spacing: 10px;
    color: #c92f35;
}

/* جعل القوائم أفقية */
.hz-nav {
    order: 2;
    flex: 1;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.hz-menu,
.hz-menu-account {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.hz-menu > li,
.hz-menu-account > li {
    display: inline-flex !important;
    align-items: center !important;
    position: relative;
}

.hz-menu > li > a,
.hz-menu-account > li > a,
.hz-menu .dropdown-toggle {
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
    padding: 12px 0 !important;
}

/* Dropdown مضبوط */
/* ===== Professional Header Dropdowns ===== */

.hz-header,
.hz-inner,
.hz-nav,
.hz-menu,
.hz-menu > li {
    overflow: visible !important;
}

.hz-menu > li {
    position: relative !important;
}

.hz-menu .dropdown-menu {
    display: block !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;

    position: absolute !important;
    top: calc(100% + 18px) !important;
    right: 50% !important;
    left: auto !important;
    transform: translateX(50%) translateY(12px) scale(.96) !important;

    min-width: 270px;
    padding: 12px !important;
    margin: 0 !important;

    background: rgba(9, 31, 39, .96) !important;
    backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.10) !important;
    border-top: 3px solid #ff3b42 !important;
    border-radius: 18px !important;

    box-shadow:
        0 28px 60px rgba(0,0,0,.42),
        inset 0 1px 0 rgba(255,255,255,.08);

    transition:
        opacity .22s ease,
        transform .22s ease,
        visibility .22s ease;
}

.hz-menu .dropdown-menu::before {
    content: "";
    position: absolute;
    top: -9px;
    right: 50%;
    width: 16px;
    height: 16px;
    transform: translateX(50%) rotate(45deg);
    background: #ff3b42;
    border-radius: 3px;
}

.hz-menu li.dropdown:hover > .dropdown-menu,
.hz-menu li.dropdown.show > .dropdown-menu,
.hz-menu li.open > .dropdown-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translateX(50%) translateY(0) scale(1) !important;
}

.hz-menu .dropdown-menu li {
    display: block !important;
}

.hz-menu .dropdown-menu a {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;

    color: #f0eef7bd !important;
    background: transparent !important;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.4;

    padding: 13px 14px !important;
    margin-bottom: 5px;
    border-radius: 13px;
    text-align: right;
    white-space: nowrap;

    transition:
        background .22s ease,
        color .22s ease,
        transform .22s ease,
        padding .22s ease;
}

.hz-menu .dropdown-menu a:last-child {
    margin-bottom: 0;
}

.hz-menu .dropdown-menu a::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ff3b42;
    opacity: .45;
    flex-shrink: 0;
    transition: .22s ease;
}

.hz-menu .dropdown-menu a:hover {
    color: #fff !important;
    background: linear-gradient(135deg, rgba(2, 26, 46, 0.22), rgba(255,255,255,.07)) !important;
    transform: translateX(-6px);
    padding-right: 18px !important;
}

.hz-menu .dropdown-menu a:hover::before {
    opacity: 1;
    box-shadow: 0 0 14px #0f012fbf;
} 

/* السهم بجانب القوائم */
.hz-menu .dropdown-toggle::after {
    margin-right: 8px !important;
    vertical-align: middle;
    border-top-color: currentColor !important;
    transition: transform .22s ease;
}

.hz-menu li.dropdown:hover > .dropdown-toggle::after,
.hz-menu li.dropdown.show > .dropdown-toggle::after,
.hz-menu li.open > .dropdown-toggle::after {
    transform: rotate(180deg);
}

/* تحسين لون الروابط الرئيسية */
.hz-menu > li > a,
.hz-menu .dropdown-toggle {
    color: #e8f0f2 !important;
}

.hz-menu > li:hover > a,
.hz-menu > li.show > a,
.hz-menu > li.open > a {
    color: hwb(358 15% 18%) !important;
}

/* موبايل */
@media (max-width: 1199px) {
    .hz-menu .dropdown-menu {
        position: static !important;
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
        transform: none !important;

        min-width: 100%;
        margin: 6px 0 12px !important;
        border-radius: 16px !important;
        border-top: 1px solid rgba(255,255,255,.10) !important;
    }

    .hz-menu .dropdown-menu::before {
        display: none;
    }

    .hz-menu .dropdown-menu a:hover {
        transform: none;
    }
}
.hz-actions {
    order: 3;
    display: flex;
    align-items: center;
    gap: 14px;
    flex-shrink: 0;
}

.hz-cart,
.hz-lang,
.hz-login,
.hz-toggle {
    height: 56px;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.08);
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 17px;
    font-weight: 900;
    text-decoration: none !important;
    transition: .25s ease;
}
.hz-menu > li {
    margin: 0 18px !important;
}

.hz-cart {
    width: 62px;
    position: relative;
}

.hz-cart span {
    position: absolute;
    top: -10px;
    right: -8px;
    min-width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #ff3b42;
    color: #fff;
    font-size: 13px;
    line-height: 25px;
    text-align: center;
    box-shadow: 0 10px 22px rgba(255,59,66,.35);
}

.hz-lang {
    padding: 0 22px;
    cursor: pointer;
}

.hz-login {
    padding: 0 28px;
    background: linear-gradient(135deg, #ff3b42, #c92f35);
    box-shadow: 0 16px 30px rgba(201,47,53,.35);
}

.hz-cart:hover,
.hz-lang:hover,
.hz-toggle:hover {
    background: rgba(255,255,255,.13);
    transform: translateY(-2px);
}

.hz-login:hover {
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 20px 38px rgba(201,47,53,.48);
}

.hz-toggle {
    display: none;
    width: 56px;
    padding: 0;
    cursor: pointer;
}

.sy-new-flag {
    width: 30px;
    height: 20px;
    display: inline-block;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    background:
        linear-gradient(to bottom,
            #009246 0 33.33%,
            #ffffff 33.33% 66.66%,
            #111111 66.66% 100%
        );
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.55),
        0 0 0 1px rgba(0,0,0,.25),
        0 6px 12px rgba(0,0,0,.25);
}

.sy-new-flag::before,
.sy-new-flag::after {
    content: "★";
    position: absolute;
    top: 6px;
    color: #ce1126;
    font-size: 7px;
    line-height: 1;
    text-shadow: 0 .5px 0 rgba(0,0,0,.15);
}

.sy-new-flag::before {
    left: 8px;
}

.sy-new-flag::after {
    right: 8px;
}

@media (max-width: 1199px) {
    .hz-inner {
        min-height: 78px;
        flex-wrap: wrap;
        gap: 12px;
    }

    .hz-toggle {
        display: inline-flex;
        order: 4;
    }

    .hz-logo {
        margin-left: auto;
    }

    .hz-nav {
        order: 5;
        flex-basis: 100%;
        display: none !important;
        padding: 14px;
        background: rgba(255,255,255,.06);
        border-radius: 18px;
        border: 1px solid rgba(255,255,255,.08);
    }

    .hz-nav.show {
        display: block !important;
    }

    .hz-menu,
    .hz-menu-account {
        display: block !important;
        margin: 0;
    }

    .hz-menu > li > a,
    .hz-menu .dropdown-toggle {
        display: block;
        padding: 13px 14px !important;
    }

    .hz-menu > li > a::after {
        display: none;
    }

    .hz-menu .dropdown-menu {
        position: static !important;
        float: none !important;
        transform: none !important;
        margin: 6px 0 10px !important;
        min-width: 100%;
    }

    .hz-menu .dropdown-menu::before {
        display: none;
    }
}

@media (max-width: 576px) {
    .hz-logo img {
        max-height: 40px;
    }

    .hz-logo span {
        font-size: 24px;
        letter-spacing: 5px;
    }

    .hz-actions {
        gap: 6px;
    }

    .hz-lang span:first-child,
    .hz-login span {
        display: none;
    }

    .hz-cart,
    .hz-lang,
    .hz-login,
    .hz-toggle {
        width: 44px;
        height: 44px;
        padding: 0;
        border-radius: 14px;
    }
}
/* إلغاء الخلفية البيضاء الافتراضية */
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    background-color: transparent !important;
}

/* ===== Language Dropdown ===== */

.hz-lang-dropdown {
  position: relative;
}

.hz-lang-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  padding: 10px 16px;
  color: #fff;
  cursor: pointer;
  transition: .25s;
}

.hz-lang-btn:hover {
  background: hsla(251, 93%, 12%, 0.18);
  transform: translateY(-2px);
}

.hz-flag {
  width: 24px;
  height: 16px;
  border-radius: 3px;
}

/* القائمة */
.hz-lang-menu {
  position: absolute;
  top: 120%;
  right: 0;
  width: 180px;
  background: rgba(15,31,42,.95);
  backdrop-filter: blur(14px);
  border-radius: 18px;
  padding: 10px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: .25s;
  z-index: 999;
}

/* تظهر عند hover */
.hz-lang-dropdown:hover .hz-lang-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* العناصر */
.hz-lang-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #fff;
  text-decoration: none;
  transition: .2s;
}

.hz-lang-item img {
  width: 22px;
}

.hz-lang-item:hover {
  background:#122730;
}
/* تحسين الهيدر للموبايل */
@media (max-width: 768px) {

    .header, .navbar {
        padding: 10px 12px !important;
    }

    .navbar-brand {
        font-size: 18px !important;
    }

    /* تصغير الأزرار */
    .nav-icons {
        gap: 6px !important;
    }

    .nav-icons .btn,
    .nav-icons a {
        width: 38px !important;
        height: 38px !important;
        font-size: 14px !important;
    }

    /* اللغة */
    .language-switch {
        padding: 6px 10px !important;
        font-size: 13px !important;
    }

    .language-switch img {
        width: 18px !important;
        height: 12px !important;
    }
}
@media (max-width: 768px) {

    .navbar-collapse.collapse:not(.show) {
        display: none !important;
    }

    .navbar-collapse.collapse.show,
    .navbar-collapse.show,
    .navbar-collapse.collapsing {
        display: block !important;
        height: auto !important;
        max-height: calc(100vh - 95px) !important;
        overflow-y: auto !important;

        position: absolute !important;
        top: 100% !important;
        left: 12px !important;
        right: 12px !important;
        width: auto !important;

        background: rgba(18, 32, 40, .98) !important;
        border: 1px solid rgba(255,255,255,.12) !important;
        border-radius: 18px !important;
        padding: 12px !important;
        margin-top: 10px !important;
        z-index: 99999 !important;
        box-shadow: 0 20px 60px rgba(0,0,0,.45) !important;
    }

    .navbar-collapse.show .navbar-nav,
    .navbar-collapse.collapsing .navbar-nav {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .navbar-collapse.show .navbar-nav > li,
    .navbar-collapse.show .navbar-nav > .nav-item {
        display: block !important;
        width: 100% !important;
    }

    .navbar-collapse.show .navbar-nav .nav-link,
    .navbar-collapse.show .navbar-nav > li > a {
        display: flex !important;
        width: 100% !important;
        min-height: 48px !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 13px 16px !important;
        border-radius: 14px !important;
        background: rgba(255,255,255,.05) !important;
        color: #fff !important;
        font-size: 15px !important;
        font-weight: 700 !important;
    }

    .navbar-collapse.show .dropdown-menu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        margin: 8px 0 0 !important;
        padding: 8px !important;
        background: rgba(5, 31, 36, .96) !important;
        border-radius: 14px !important;
        border: 1px solid rgba(255,255,255,.08) !important;
    }

    .navbar-collapse.show .dropdown.show > .dropdown-menu,
    .navbar-collapse.show .dropdown-menu.show {
        display: block !important;
    }

    .navbar-collapse.show .dropdown-menu a,
    .navbar-collapse.show .dropdown-menu .dropdown-item {
        display: block !important;
        padding: 12px 14px !important;
        color: rgba(255,255,255,.85) !important;
        border-radius: 10px !important;
        font-size: 14px !important;
    }
}
/*تنسيق مربع البحث*/
/* ===== DOMAIN SEARCH PROFESSIONAL FINAL ===== */

#frmDomainHomepage .ultra-domain-section {
  padding: 95px 20px !important;
  background: transparent !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
}

#frmDomainHomepage .ultra-domain-section::before {
  content: "" !important;
  position: absolute !important;
  width: 520px !important;
  height: 520px !important;
  top: -260px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: radial-gradient(circle, rgba(187,48,48,.22), transparent 65%) !important;
  animation: domainGlow 6s ease-in-out infinite !important;
  pointer-events: none !important;
   display: none !important;
  content: none !important;
}

@keyframes domainGlow {
  0%, 100% {
    transform: translateX(-50%) translateY(0) scale(1);
  }
  50% {
    transform: translateX(-50%) translateY(35px) scale(1.12);
  }
}

#frmDomainHomepage .ultra-domain-container {
  max-width: 1050px !important;
  margin: auto !important;
  position: relative !important;
  z-index: 2 !important;
}

#frmDomainHomepage .ultra-domain-header h2 {
  font-size: 46px !important;
  font-weight: 900 !important;
  color: #162b3a !important;
  margin-bottom: 34px !important;
}

#frmDomainHomepage .ultra-domain-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 18px !important;
  border-radius: 999px !important;
  background: rgba(187,48,48,.1) !important;
  color: #bb3030 !important;
  font-weight: 900 !important;
  margin-bottom: 16px !important;
  animation: floatDomain 3.5s ease-in-out infinite !important;
}

#frmDomainHomepage .ultra-domain-box {
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 12px !important;
  background: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(187,48,48,.14) !important;
  border-radius: 28px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: 0 28px 80px rgba(20,45,70,.16) !important;
  position: relative !important;
  overflow: hidden !important;
  animation: domainBoxShow .7s ease both !important;
}

#frmDomainHomepage .ultra-domain-box::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(187,48,48,.18) 45%,
    transparent 70%
  ) !important;
  transform: translateX(-120%) !important;
  animation: domainShine 4s ease-in-out infinite !important;
  pointer-events: none !important;
}

@keyframes domainBoxShow {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes domainShine {
  0% {
    transform: translateX(-120%);
  }
  45%, 100% {
    transform: translateX(120%);
  }
}

#frmDomainHomepage .ultra-domain-box input {
  height: 66px !important;
  flex: 1 !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 20px !important;
  background: #f8fafc !important;
  color: #162b3a !important;
  font-size: 19px !important;
  padding: 0 24px !important;
  box-shadow: inset 0 0 0 1px rgba(20,45,70,.07) !important;
  position: relative !important;
  z-index: 2 !important;
}

#frmDomainHomepage .ultra-domain-box input:focus {
  background: #fff !important;
  box-shadow:
    inset 0 0 0 2px rgba(187,48,48,.25),
    0 0 0 7px rgba(187,48,48,.08) !important;
}

#frmDomainHomepage .ultra-domain-actions {
  display: flex !important;
  gap: 10px !important;
  position: relative !important;
  z-index: 2 !important;
}

#frmDomainHomepage .ultra-domain-actions button {
  height: 66px !important;
  border: 0 !important;
  border-radius: 18px !important;
  padding: 0 26px !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  transition: .28s ease !important;
}

#frmDomainHomepage .ultra-domain-search {
  background: linear-gradient(135deg, #bb3030, #d84a4a) !important;
  color: #fff !important;
  box-shadow: 0 14px 35px rgba(187,48,48,.28) !important;
}

#frmDomainHomepage .ultra-domain-transfer {
  background: linear-gradient(135deg, #17343c, #244f59) !important;
  color: #fff !important;
  box-shadow: 0 14px 35px rgba(23,52,60,.25) !important;
}

#frmDomainHomepage .ultra-domain-actions button:hover {
  transform: translateY(-4px) !important;
  filter: brightness(1.08) !important;
}

#frmDomainHomepage .ultra-tld-list {
  margin-top: 34px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 18px !important;
  flex-wrap: wrap !important;
}

#frmDomainHomepage .ultra-tld-card {
  min-height: 64px !important;
  padding: 14px 20px !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(187,48,48,.12) !important;
  border-radius: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: 0 18px 45px rgba(20,45,70,.11) !important;
  transition: .28s ease !important;
  animation: floatDomain 4s ease-in-out infinite !important;
}

#frmDomainHomepage .ultra-tld-card:nth-child(2) {
  animation-delay: .35s !important;
}

#frmDomainHomepage .ultra-tld-card:nth-child(3) {
  animation-delay: .7s !important;
}

@keyframes floatDomain {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-9px);
  }
}

#frmDomainHomepage .ultra-tld-card:hover {
  transform: translateY(-8px) scale(1.04) !important;
  box-shadow: 0 28px 60px rgba(20,45,70,.16) !important;
}

#frmDomainHomepage .ultra-tld-card img {
  max-height: 38px !important;
  width: auto !important;
}

#frmDomainHomepage .ultra-tld-card span {
  color: #64748b !important;
  font-size: 18px !important;
  font-weight: 800 !important;
}

#frmDomainHomepage .ultra-domain-pricing-btn {
  min-height: 64px !important;
  padding: 14px 24px !important;
  border-radius: 20px !important;
  background: linear-gradient(135deg, #bb3030, #d84a4a) !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  box-shadow: 0 18px 42px rgba(187,48,48,.28) !important;
  transition: .28s ease !important;
}

#frmDomainHomepage .ultra-domain-pricing-btn:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 28px 60px rgba(187,48,48,.38) !important;
}

@media (max-width: 768px) {
  #frmDomainHomepage .ultra-domain-header h2 {
    font-size: 32px !important;
  }

  #frmDomainHomepage .ultra-domain-box {
    display: grid !important;
  }

  #frmDomainHomepage .ultra-domain-actions {
    grid-template-columns: 1fr 1fr !important;
    display: grid !important;
  }

  #frmDomainHomepage .ultra-domain-actions button {
    width: 100% !important;
  }
}
/* ===== Better Domain Search Input + Buttons ===== */
/* ===== Domain Search Pill UI Like Reference ===== */

#frmDomainHomepage .ultra-domain-box {
  max-width: 760px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  overflow: visible !important;
}

#frmDomainHomepage .ultra-domain-box input {
  height: 58px !important;
  border-radius: 999px !important;
  background: rgba(187,48,48,.12) !important;
  border: 1px solid rgba(187,48,48,.18) !important;
  color: #162b3a !important;
  padding: 0 54px 0 22px !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  box-shadow: 0 14px 32px rgba(20,45,70,.14) !important;
}

#frmDomainHomepage .ultra-domain-box input:focus {
  background: #fff !important;
  box-shadow:
    0 18px 44px rgba(187,48,48,.18),
    0 0 0 5px rgba(187,48,48,.08) !important;
}

#frmDomainHomepage .ultra-domain-actions {
  order: -1 !important;
  display: flex !important;
  gap: 8px !important;
}

#frmDomainHomepage .ultra-domain-actions button {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 14px 32px rgba(20,45,70,.18) !important;
}

#frmDomainHomepage .ultra-domain-actions button i {
  font-size: 22px !important;
  margin: 0 !important;
}

#frmDomainHomepage .ultra-domain-search {
  background: linear-gradient(135deg, #bb3030, #d84a4a) !important;
  color: #fff !important;
}

#frmDomainHomepage .ultra-domain-transfer {
  background: linear-gradient(135deg, #17343c, #244f59) !important;
  color: #fff !important;
}

#frmDomainHomepage .ultra-domain-actions button:hover {
  transform: translateY(-4px) scale(1.07) !important;
}

@media (max-width: 768px) {
  #frmDomainHomepage .ultra-domain-box {
    max-width: 100% !important;
    display: grid !important;
  }

  #frmDomainHomepage .ultra-domain-actions {
    order: 2 !important;
    grid-template-columns: 1fr 1fr !important;
  }

  #frmDomainHomepage .ultra-domain-actions button {
    width: 100% !important;
    border-radius: 18px !important;
  }
}
/* === PREMIUM ICON BUTTONS === */

/* === PREMIUM AI DOMAIN SEARCH - FINAL === */

#frmDomainHomepage .ultra-domain-box {
  max-width: 900px !important;
  height: 76px !important;
  margin: 0 auto !important;
  padding: 8px 10px !important;
  border-radius: 28px !important;
  background: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(187,48,48,.16) !important;
  box-shadow:
    0 28px 80px rgba(20,45,70,.16),
    inset 0 0 0 1px rgba(255,255,255,.85) !important;
  display: flex !important;
  align-items: center !important; 
  gap: 10px !important;
  overflow: hidden !important;
}

/* input */
#frmDomainHomepage .ultra-domain-box input {
  flex: 1 !important;
  height: 100% !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #162b3a !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  padding: 0 22px !important;
  direction: ltr !important;
  text-align: left !important;
  box-shadow: none !important;
}

#frmDomainHomepage .ultra-domain-box:focus-within {
  border-color: rgba(187,48,48,.32) !important;
  box-shadow:
    0 34px 90px rgba(20,45,70,.18),
    0 0 0 6px rgba(187,48,48,.08) !important;
}

/* buttons container on the right */
#frmDomainHomepage .ultra-domain-actions {
  order: 2 !important;
  height: 58px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* icon buttons */
#frmDomainHomepage .ultra-domain-actions button {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  transition: .28s ease !important;
}

#frmDomainHomepage .ultra-domain-actions button i {
  font-size: 22px !important;
  color: lab(47.16% 56.38 33.51) !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 2 !important;
}

/* search button */
#frmDomainHomepage .ultra-domain-search {
  background: linear-gradient(135deg, #bb3030, #e14b4b) !important;
  box-shadow: 0 14px 32px rgba(187,48,48,.28) !important;
}

/* transfer button */
#frmDomainHomepage .ultra-domain-transfer {
  background: linear-gradient(135deg, #17343c, #244f59) !important;
  box-shadow: 0 14px 32px rgba(23,52,60,.25) !important;
}

/* shine hover */
#frmDomainHomepage .ultra-domain-actions button::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.35), transparent 80%) !important;
  transform: translateX(-120%) !important;
  transition: .55s ease !important;
}

#frmDomainHomepage .ultra-domain-actions button:hover::before {
  transform: translateX(120%) !important;
}

#frmDomainHomepage .ultra-domain-actions button:hover {
  transform: translateY(-3px) scale(1.04) !important;
}

#frmDomainHomepage .ultra-domain-actions button:active {
  transform: scale(.94) !important;
}

@media (max-width: 768px) {
  #frmDomainHomepage .ultra-domain-box {
    height: auto !important;
    display: grid !important;
    border-radius: 24px !important;
  }

  #frmDomainHomepage .ultra-domain-box input {
    height: 62px !important;
    text-align: center !important;
  }

  #frmDomainHomepage .ultra-domain-actions {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
  }

  #frmDomainHomepage .ultra-domain-actions button {
    width: 100% !important;
    border-radius: 16px !important;
  }
}
/*تنسيق قسم البطل بدل الفيديو*/
/* ===============================
   HERO SECTION - HORANOS FINAL
================================= */

.horanos-hero-new {
  position: relative !important;
  isolation: isolate !important;
  min-height: 540px !important;
  overflow: hidden !important;
  padding: 120px 20px 160px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;

  background:
    linear-gradient(135deg, #061820 0%, #0d222c 48%, #111827 100%) !important;

  /* دمج مع القسم التالي */
  margin-bottom: -120px;
}

/* Glow متحرك */
.horanos-hero-new::before {
  content: "";
  position: absolute;
  inset: -35%;
  z-index: 0;

  background:
    radial-gradient(circle at 18% 28%, rgba(187,48,48,.75), transparent 26%),
    radial-gradient(circle at 80% 34%, rgba(187,48,48,.42), transparent 24%),
    radial-gradient(circle at 48% 72%, rgba(31,58,64,.78), transparent 32%),
    radial-gradient(circle at 58% 18%, rgba(255,255,255,.14), transparent 20%);

  filter: blur(65px);
  animation: horanosGlowFlow 8s ease-in-out infinite alternate;
}

/* Fade أبيض للدمج */
.horanos-hero-new::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 240px;
  background: linear-gradient(to bottom, transparent, #ffffff);
  z-index: 2;
}

/* الشبكة */
.horanos-hero-grid {
  position: absolute !important;
  inset: -80px !important;
  z-index: 1 !important;

  background-image:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);

  background-size: 54px 54px !important;
  opacity: .38 !important;
  transform: rotate(-2deg);

  animation: horanosGridDrift 14s linear infinite;
}

/* كرات الإضاءة */
.horanos-hero-glow {
  position: absolute !important;
  border-radius: 999px !important;
  filter: blur(48px) !important;
  opacity: .75 !important;
  z-index: 1 !important;
}

.horanos-hero-glow.red {
  width: 360px !important;
  height: 360px !important;
  background: #bb3030 !important;
  top: 95px !important;
  right: 10% !important;

  animation: horanosOrbRed 7s ease-in-out infinite alternate;
}

.horanos-hero-glow.blue {
  width: 290px !important;
  height: 290px !important;
  background: #1f3a40 !important;
  bottom: 35px !important;
  left: 8% !important;

  animation: horanosOrbBlue 9s ease-in-out infinite alternate;
}

/* المحتوى */
.horanos-hero-new .container {
  position: relative !important;
  z-index: 4 !important;
}

/* الكرت (مصغّر ومحسّن) */
.horanos-hero-box {
  position: relative !important;
  max-width: 760px !important;
  margin: -20px auto 0 !important;
  text-align: center !important;

  padding: 28px 32px !important;
  border-radius: 26px !important;

  background:
    linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.05)) !important;

  border: 1px solid rgba(255,255,255,.20) !important;

  box-shadow:
    0 40px 100px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.18) !important;

  backdrop-filter: blur(16px) !important;

  animation: horanosBoxFloat 4.8s ease-in-out infinite;
}

/* لمعان الكرت */
.horanos-hero-box::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;

  background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.15), transparent 80%);
  transform: translateX(-120%);
  animation: horanosCardShine 5s ease-in-out infinite;
}

/* البادج */
.horanos-hero-badge {
  display: inline-flex !important;
  margin-bottom: 18px !important;
  padding: 8px 16px !important;

  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(187,48,48,.62), rgba(255,255,255,.10));

  border: 1px solid rgba(255,255,255,.20) !important;
  color: #fff !important;

  font-size: 13px !important;
  font-weight: 800 !important;
}

/* العنوان */
.horanos-hero-box h1 {
  margin: 0 0 14px !important;
  color: #fff !important;

  font-size: clamp(30px, 4vw, 40px) !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;

  text-shadow: 0 14px 42px rgba(0,0,0,.50);
}

/* النص */
.horanos-hero-box p {
  margin: 0 auto !important;
  max-width: 640px !important;

  color: rgba(255,255,255,.88) !important;
  font-size: 18px !important;
  line-height: 1.8 !important;
}

/* ===============================
   ANIMATIONS
================================= */

@keyframes horanosGlowFlow {
  0% { transform: translate(-6%, -4%) scale(1); }
  50% { transform: translate(5%, 4%) scale(1.14); }
  100% { transform: translate(-2%, 7%) scale(1.08); }
}

@keyframes horanosGridDrift {
  from { background-position: 0 0; }
  to { background-position: 108px 108px; }
}

@keyframes horanosOrbRed {
  from { transform: translate(0, 0) scale(1); }
  to { transform: translate(-70px, 45px) scale(1.18); }
}

@keyframes horanosOrbBlue {
  from { transform: translate(0, 0) scale(1); }
  to { transform: translate(80px, -50px) scale(1.16); }
}

@keyframes horanosBoxFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

@keyframes horanosCardShine {
  0%,45% { transform: translateX(-120%); }
  70%,100% { transform: translateX(120%); }
}

/* ===============================
   MOBILE
================================= */

@media (max-width: 768px) {
  .horanos-hero-new {
    min-height: 480px !important;
    padding: 90px 14px 140px !important;
  }

  .horanos-hero-box {
    padding: 22px 16px !important;
    border-radius: 20px !important;
  }

  .horanos-hero-box p {
    font-size: 15px !important;
  }
}

/* تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  .horanos-hero-new::before,
  .horanos-hero-grid,
  .horanos-hero-glow,
  .horanos-hero-box,
  .horanos-hero-box::before {
    animation: none !important;
  }
}
/*نهاية تنسيق قسم البطل بدل الفيديو*/
/* ===============================
   HERO SECTION - HORANOS FINAL
================================= */
/*تنسيق قسم ما هو النطاق*/
/* ==============================
================================= */
.hp-domain-premium {
    background: transparent !important;
    padding: 90px 20px !important;
}

.hp-domain-badge {
    display: inline-flex !important;
    padding: 8px 18px !important;
    border-radius: 999px !important;
    background: rgba(187,48,48,.08) !important;
    color: #BB3030 !important;
    font-weight: 800 !important;
    margin-bottom: 16px !important;
}

.hp-domain-premium-card {
    max-width: 1060px !important;
    margin: 42px auto 0 !important;
    background: transparent !important;
    border-radius: 34px !important;
    padding: 34px !important;
    display: grid !important;
    grid-template-columns: .95fr 1.05fr !important;
    gap: 34px !important;
    align-items: center !important;
    
    
}

.hp-browser {
    border-radius: 24px !important;
    overflow: hidden !important;
    border: 1px solid rgba(31,58,64,.12) !important;
    background: #f7fbff !important;
    box-shadow: 0 20px 55px rgba(31,58,64,.12) !important;
}

.hp-browser-top {
    height: 48px !important;
    background: #f3f4f6 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 14px !important;
}

.hp-browser-top span {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    background: #BB3030 !important;
}

.hp-browser-top span:nth-child(2) {
    background: #f59e0b !important;
}

.hp-browser-top span:nth-child(3) {
    background: #22c55e !important;
}

.hp-browser-url {
    flex: 1 !important;
    height: 26px !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #1F3A40 !important;
    font-size: 13px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 14px !important;
    margin-inline-start: 8px !important;
}

.hp-browser-body {
    min-height: 280px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 30px !important;
    background:
        radial-gradient(circle at 20% 20%, rgba(187,48,48,.10), transparent 28%),
        linear-gradient(135deg, #ffffff, #eef8ff) !important;
}

.hp-logo-dot {
    width: 64px !important;
    height: 64px !important;
    border-radius: 20px !important;
    background: #1F3A40 !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    margin-bottom: 18px !important;
}

.hp-browser-body h3 {
    margin: 0 0 10px !important;
    color: #1F3A40 !important;
    font-size: 26px !important;
    font-weight: 900 !important;
}

.hp-browser-body p {
    color: rgba(31,58,64,.70) !important;
    margin: 0 !important;
}

.hp-domain-lead {
    color: #1F3A40 !important;
    font-size: 17px !important;
    line-height: 2 !important;
    margin-bottom: 22px !important;
}

.hp-domain-lead strong {
    color: #BB3030 !important;
}

.hp-domain-steps {
    display: grid !important;
    gap: 14px !important;
    margin-bottom: 22px !important;
}

.hp-domain-step {
    display: flex !important;
    gap: 14px !important;
    align-items: flex-start !important;
    padding: 16px !important;
    border-radius: 20px !important;
    background: #f8fafc !important;
    border: 1px solid rgba(31,58,64,.08) !important;
}

.hp-domain-step span {
    min-width: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
    background: #BB3030 !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 900 !important;
}

.hp-domain-step h4 {
    margin: 0 0 4px !important;
    color: #1F3A40 !important;
    font-weight: 900 !important;
}

.hp-domain-step p {
    margin: 0 !important;
    color: rgba(31,58,64,.68) !important;
    line-height: 1.8 !important;
}

.hp-pillrow {
    display: flex !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
    margin-bottom: 22px !important;
}

.hp-pill {
    padding: 9px 15px !important;
    border-radius: 999px !important;
    background: rgba(31,58,64,.06) !important;
    color: #1F3A40 !important;
    font-weight: 700 !important;
    font-size: 14px !important;
}

.hp-domain-premium .btn.btn-default {
    width: 100% !important;
    height: 54px !important;
    border-radius: 16px !important;
    background: #BB3030 !important;
    border: none !important;
    color: #fff !important;
    font-weight: 900 !important;
    transition: .25s ease !important;
}

.hp-domain-premium .btn.btn-default:hover {
    background: #9f1d22 !important;
    transform: translateY(-2px) !important;
}

@media (max-width: 991px) {
    .hp-domain-premium-card {
        grid-template-columns: 1fr !important;
        padding: 24px !important;
    }
}

@media (max-width: 576px) {
    .hp-domain-premium {
        padding: 60px 14px !important;
    }

    .hp-domain-premium-card {
        border-radius: 24px !important;
        padding: 18px !important;
    }

    .hp-browser-body {
        min-height: 220px !important;
    }

    .hp-domain-step {
        padding: 14px !important;
    }
}
.hp-reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: all .8s cubic-bezier(.19,1,.22,1);
}

.hp-reveal.active {
    opacity: 1;
    transform: translateY(0);
}
.hp-domain-step {
    transition: all .3s ease;
}

.hp-domain-step:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0,0,0,.12);
    background: #fff !important;
}
.hp-domain-premium .btn.btn-default {
    position: relative;
    overflow: hidden;
}

.hp-domain-premium .btn.btn-default::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,.35), transparent);
    transform: translateX(-100%);
}

.hp-domain-premium .btn.btn-default:hover::after {
    transform: translateX(100%);
    transition: 0.7s;
}
.hp-pill {
    animation: floatSoft 4s ease-in-out infinite;
}

.hp-pill:nth-child(2) {
    animation-delay: .5s;
}
.hp-pill:nth-child(3) {
    animation-delay: 1s;
}

@keyframes floatSoft {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}
.hp-browser {
    animation: floatCard 6s ease-in-out infinite;
}

@keyframes floatCard {
    0%,100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}
.hp-domain-premium {
    position: relative;
}

.hp-domain-premium::before {
    content: "";
    position: absolute;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(187,48,48,.15), transparent 70%);
    top: -100px;
    left: -100px;
    filter: blur(60px);
    z-index: 0;
}
.hp-section-title {
    position: relative;
    display: inline-block;
}

.hp-section-title::after {
    content: "";
    position: absolute;
    width: 0;
    height: 4px;
    background: #BB3030;
    left: 0;
    bottom: -6px;
    transition: .4s;
}

.hp-section-title:hover::after {
    width: 100%;
} 
.hp-logo-dot {
    width: 64px !important;
    height: 64px !important;
    border-radius: 20px !important;
    background: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.12);
}

.hp-logo-dot img {
    width: 38px !important;
    height: auto !important;
    object-fit: contain !important;
}
.hp-logo-dot {
    transition: .3s ease;
}

.hp-logo-dot:hover {
    transform: scale(1.08) rotate(3deg);
}
/*نهاية تنسيق قسم ما هو النطاق*/
/* ==============================
================================= */
/* ================================
   لماذا يُعدّ الوجود الرقمي مهمًا؟
================================ */

.hp-presence-full {
  position: relative !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  overflow: hidden !important;
  padding: 115px 20px 105px !important;

  /* دمج ناعم مع خلفية الصفحة */
  background:
    linear-gradient(to bottom,
      #F7F7F9 0%,
      #F7F7F9 8%,
      rgba(247,247,249,.92) 18%,
      rgba(255,255,255,.78) 38%,
      rgba(247,247,249,.90) 78%,
      #F7F7F9 100%
    ) !important;
}

.hp-presence-full::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(31,58,64,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,58,64,.055) 1px, transparent 1px);
  background-size: 62px 62px;
  animation: hpGridFlow 22s linear infinite;
  opacity: .9;
}

.hp-presence-full::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to bottom,
      #F7F7F9 0%,
      rgba(247,247,249,.55) 16%,
      rgba(247,247,249,.10) 45%,
      rgba(247,247,249,.55) 84%,
      #F7F7F9 100%
    );
  pointer-events: none;
}

@keyframes hpGridFlow {
  from { transform: translate3d(0,0,0); }
  to { transform: translate3d(62px,62px,0); }
}

.hp-presence-inner {
  position: relative !important;
  z-index: 5 !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
}

/* Header */
.hp-presence-head {
  max-width: 760px !important;
  margin: 0 auto 44px !important;
  text-align: center !important;
}

.hp-presence-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 14px !important;
  padding: 8px 18px !important;
  border-radius: 999px !important;
  background: rgba(187,48,48,.09) !important;
  border: 1px solid rgba(187,48,48,.16) !important;
  color: #BB3030 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 1.8px !important;
}

.hp-presence-full .hp-section-title {
  color: #1F3A40 !important;
  font-size: 36px !important;
  font-weight: 950 !important;
  margin: 0 0 12px !important;
}

.hp-presence-full .hp-section-subtitle {
  color: rgba(31,58,64,.68) !important;
  font-size: 15px !important;
  line-height: 1.9 !important;
  margin: 0 !important;
}

/* Background network */
.hp-presence-network {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
}

.net-orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(52px);
  opacity: .75;
  animation: hpOrbMove 10s ease-in-out infinite;
}

.net-orb.o1 {
  background: rgba(187,48,48,.09) !important;
}

.net-orb.o2 {
  background: rgba(31,58,64,.10) !important;
}

.hp-presence-full::before {
  opacity: .45 !important;
}

@keyframes hpOrbMove {
  0%,100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-34px) scale(1.08); }
}

.net-dot {
  position: absolute;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #BB3030;
  box-shadow:
    0 0 0 9px rgba(187,48,48,.10),
    0 0 35px rgba(187,48,48,.45);
  animation: hpDotPulse 2.8s ease-in-out infinite;
}

.net-dot.d1 { top: 24%; left: 12%; }
.net-dot.d2 { top: 30%; right: 16%; animation-delay: .4s; }
.net-dot.d3 { bottom: 27%; left: 18%; animation-delay: .8s; }
.net-dot.d4 { bottom: 22%; right: 12%; animation-delay: 1.2s; }
.net-dot.d5 { top: 52%; left: 50%; animation-delay: 1.6s; }

@keyframes hpDotPulse {
  0%,100% { transform: scale(1); opacity: .55; }
  50% { transform: scale(1.45); opacity: 1; }
}

.net-line {
  position: absolute;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(187,48,48,.45), transparent);
  opacity: .5;
  animation: hpLineGlow 4s ease-in-out infinite;
}

.net-line.l1 {
  width: 520px;
  top: 28%;
  left: 13%;
  transform: rotate(8deg);
}

.net-line.l2 {
  width: 560px;
  top: 52%;
  right: 12%;
  transform: rotate(-10deg);
  animation-delay: -1.5s;
}

.net-line.l3 {
  width: 470px;
  bottom: 24%;
  left: 32%;
  transform: rotate(6deg);
  animation-delay: -2.5s;
}

@keyframes hpLineGlow {
  0%,100% { opacity: .16; filter: blur(0); }
  50% { opacity: .7; filter: blur(.4px); }
}

/* Cards layout */
.hp-presence-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
  width: 100% !important;
}

.hp-presence-card {
  position: relative !important;
  overflow: hidden !important;
  min-height: 245px !important;
  padding: 36px 24px 30px !important;
  border-radius: 30px !important;
  background: rgba(255,255,255,.78) !important;
  border: 1px solid rgba(255,255,255,.95) !important;
  backdrop-filter: blur(22px) !important;
  -webkit-backdrop-filter: blur(22px) !important;
  text-align: center !important;
  box-shadow:
    0 35px 90px rgba(31,58,64,.11),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  transition: .38s ease !important;
  animation: hpCardIn .85s ease both;
}

.hp-presence-card:nth-child(1) { animation-delay: .08s; }
.hp-presence-card:nth-child(2) { animation-delay: .18s; }
.hp-presence-card:nth-child(3) { animation-delay: .28s; }
.hp-presence-card:nth-child(4) { animation-delay: .38s; }

.hp-presence-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at top right, rgba(187,48,48,.16), transparent 45%),
    linear-gradient(135deg, rgba(255,255,255,.95), transparent 55%);
  opacity: 0;
  transition: .38s ease;
}

.hp-presence-card::after {
  content: "";
  position: absolute;
  width: 120px;
  height: 120px;
  top: -55px;
  right: -55px;
  border-radius: 50%;
  background: rgba(187,48,48,.08);
  transition: .38s ease;
}

.hp-presence-card:hover {
  transform: translateY(-14px);
  box-shadow:
    0 45px 105px rgba(31,58,64,.18),
    0 20px 45px rgba(187,48,48,.08) !important;
  border-color: rgba(187,48,48,.22) !important;
}

.hp-presence-card:hover::before {
  opacity: 1;
}

.hp-presence-card:hover::after {
  transform: scale(1.8);
}

/* Floating icon */
.hp-floating-icon {
  position: relative !important;
  z-index: 2 !important;
  width: 78px !important;
  height: 78px !important;
  margin: 0 auto 20px !important;
  border-radius: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background:
    linear-gradient(145deg, #ffffff, #eef3f5) !important;
  border: 1px solid rgba(31,58,64,.08) !important;
  box-shadow:
    0 20px 42px rgba(31,58,64,.14),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  animation: hpIconFloat 3.4s ease-in-out infinite;
}

.hp-presence-card:nth-child(2) .hp-floating-icon { animation-delay: -.7s; }
.hp-presence-card:nth-child(3) .hp-floating-icon { animation-delay: -1.4s; }
.hp-presence-card:nth-child(4) .hp-floating-icon { animation-delay: -2.1s; }

.hp-floating-icon i {
  font-size: 32px !important;
  color: #BB3030 !important;
  text-shadow: 0 12px 25px rgba(187,48,48,.22) !important;
}

@keyframes hpIconFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-9px); }
}

.hp-presence-card h3,
.hp-presence-card p {
  position: relative !important;
  z-index: 2 !important;
}

.hp-presence-card h3 {
  color: #1F3A40 !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  margin: 0 0 10px !important;
}

.hp-presence-card p {
  color: rgba(31,58,64,.62) !important;
  font-size: 14px !important;
  line-height: 1.9 !important;
  margin: 0 !important;
}

/* Buttons */
.hp-presence-actions {
  position: relative !important;
  z-index: 5 !important;
  display: flex !important;
  justify-content: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  margin-top: 38px !important;
  animation: hpCardIn .85s ease .45s both;
}

.hp-btn {
  min-width: 168px !important;
  height: 52px !important;
  padding: 0 26px !important;
  border-radius: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  transition: .32s ease !important;
}

.hp-btn-primary {
  color: #fff !important;
  background: #BB3030 !important;
  border: 1px solid #BB3030 !important;
  box-shadow: 0 18px 42px rgba(187,48,48,.34) !important;
}

.hp-btn-primary:hover {
  background: #9f1d22 !important;
  color: #fff !important;
  transform: translateY(-4px);
  box-shadow: 0 25px 55px rgba(187,48,48,.45) !important;
}

.hp-btn-secondary {
  color: #1F3A40 !important;
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(31,58,64,.24) !important;
}

.hp-btn-secondary:hover {
  color: #fff !important;
  background: #1F3A40 !important;
  border-color: #1F3A40 !important;
  transform: translateY(-4px);
}

@keyframes hpCardIn {
  from {
    opacity: 0;
    transform: translateY(36px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Responsive */
@media (max-width: 1100px) {
  .hp-presence-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 768px) {
  .hp-presence-full {
    padding: 82px 16px !important;
  }

  .hp-presence-full .hp-section-title {
    font-size: 26px !important;
  }

  .hp-presence-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .hp-presence-card {
    min-height: auto !important;
    padding: 30px 20px !important;
  }

  .hp-presence-actions {
    flex-direction: column !important;
  }

  .hp-btn {
    width: 100% !important;
  }

  .net-line {
    display: none !important;
  }
}
/* ================================
   نهاية لماذا يُعدّ الوجود الرقمي مهمًا؟
================================ */

/* =====================================================
   ULTRA PREMIUM HOSTING PLANS - FINAL
===================================================== */

#order-pure_comparison {
  --hp-red: #BB3030;
  --hp-red-dark: #9f1d22;
  --hp-dark: #1F3A40;
  --hp-muted: rgba(31,58,64,.64);
  --hp-border: rgba(31,58,64,.10);
}

/* ================= Combo Box ================= */

#order-pure_comparison .billing-switcher {
  max-width: 980px !important;
  margin: 28px auto 52px !important;
  padding: 12px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.86) !important;
  border: 1px solid rgba(255,255,255,.95) !important;
  box-shadow:
    0 28px 80px rgba(31,58,64,.10),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

#order-pure_comparison .billing-switcher label {
  flex: 1 !important;
  margin: 0 !important;
  padding: 0 20px !important;
  color: var(--hp-dark) !important;
  font-size: 14px !important;
  font-weight: 950 !important;
}

#billingCycleSelect {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 320px !important;
  height: 56px !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: 0 52px 0 24px !important;
  background:
    linear-gradient(45deg, transparent 50%, var(--hp-red) 50%) calc(100% - 27px) 24px / 7px 7px no-repeat,
    linear-gradient(135deg, var(--hp-red) 50%, transparent 50%) calc(100% - 21px) 24px / 7px 7px no-repeat,
    linear-gradient(145deg, #fff, #f7f9fb) !important;
  color: var(--hp-dark) !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  text-align: center !important;
  text-align-last: center !important;
  cursor: pointer !important;
  box-shadow:
    inset 0 0 0 1px rgba(31,58,64,.13),
    0 16px 34px rgba(31,58,64,.09) !important;
  transition: .3s ease !important;
}

#billingCycleSelect:hover,
#billingCycleSelect:focus {
  outline: none !important;
  box-shadow:
    inset 0 0 0 1px rgba(187,48,48,.38),
    0 18px 44px rgba(187,48,48,.16),
    0 0 0 5px rgba(187,48,48,.07) !important;
}

/* ================= Cards Grid ================= */

#order-pure_comparison .price-table-container > ul {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 32px !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
}

#order-pure_comparison .price-table-container > ul > li {
  width: auto !important;
  margin: 0 !important;
  list-style: none !important;
}

/* ================= Card ================= */

#order-pure_comparison .price-table {
  position: relative !important;
  overflow: hidden !important;
  height: 100% !important;
  border-radius: 34px !important;
  background:
    radial-gradient(circle at 88% 8%, rgba(187,48,48,.11), transparent 28%),
    radial-gradient(circle at 8% 96%, rgba(31,58,64,.08), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, #fbfcfd 100%) !important;
  border: 1px solid rgba(31,58,64,.10) !important;
  box-shadow:
    0 34px 95px rgba(31,58,64,.12),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  transition: .38s ease !important;
  animation: hpPlanFloat 6.5s ease-in-out infinite;
}

#order-pure_comparison .price-table-container > ul > li:nth-child(2) .price-table {
  animation-delay: -1.3s;
}

#order-pure_comparison .price-table-container > ul > li:nth-child(3) .price-table {
  animation-delay: -2.6s;
}

@keyframes hpPlanFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

#order-pure_comparison .price-table::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(255,255,255,.9), transparent 45%),
    radial-gradient(circle at top right, rgba(187,48,48,.16), transparent 36%);
  opacity: 0;
  transition: .38s ease;
  pointer-events: none;
}

#order-pure_comparison .price-table::after {
  content: "";
  position: absolute;
  inset: 10px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.85);
  pointer-events: none;
}

#order-pure_comparison .price-table:hover {
  animation-play-state: paused;
  transform: translateY(-18px) scale(1.018) !important;
  border-color: rgba(187,48,48,.28) !important;
  box-shadow:
    0 48px 125px rgba(31,58,64,.20),
    0 22px 52px rgba(187,48,48,.12) !important;
}

#order-pure_comparison .price-table:hover::before {
  opacity: 1;
}

/* ================= Header ================= */

#order-pure_comparison .top-head {
  position: relative !important;
  z-index: 2 !important;
  padding: 34px 30px 22px !important;
  background:
    linear-gradient(180deg, rgba(248,250,252,.96), rgba(255,255,255,.78)) !important;
  border-bottom: 1px solid rgba(31,58,64,.08) !important;
}

#order-pure_comparison .top-head::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -1px;
  width: 72px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, var(--hp-red), transparent);
  transform: translateX(-50%);
  opacity: .6;
}

#order-pure_comparison .top-area h4 {
  color: var(--hp-dark) !important;
  font-size: 30px !important;
  font-weight: 950 !important;
  text-align: center !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

/* Featured badge */
#order-pure_comparison .popular-plan,
#order-pure_comparison .plan-container {
  position: static !important;
  margin-top: 18px !important;
  background: none !important;
}

#order-pure_comparison .popular-plan .txt-container {
  height: 38px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--hp-red), var(--hp-red-dark)) !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: .5px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow:
    0 16px 34px rgba(187,48,48,.28),
    inset 0 1px 0 rgba(255,255,255,.20) !important;
}

/* ================= Feature List ================= */

#order-pure_comparison .price-table > ul {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  margin: 0 !important;
  padding: 26px 32px 12px !important;
  list-style: none !important;
}

#order-pure_comparison .price-table > ul > li {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 13px 0 !important;
  border-bottom: 1px solid rgba(31,58,64,.075) !important;
  color: rgba(31,58,64,.86) !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.65 !important;
  text-align: start !important;
}

#order-pure_comparison .price-table > ul > li::before,
#order-pure_comparison .price-table > ul > li::after {
  display: none !important;
  content: none !important;
}

/* Smart FontAwesome Icons */
.plan-smart-icon {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border-radius: 16px !important;
  background:
    linear-gradient(145deg, #fff, #fff0f0) !important;
  color: var(--hp-red) !important;
  border: 1px solid rgba(187,48,48,.16) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 17px !important;
  box-shadow:
    0 14px 28px rgba(187,48,48,.16),
    inset 0 1px 0 rgba(255,255,255,.95) !important;
  animation: hpIconFloat 3.3s ease-in-out infinite;
  transition: .32s ease !important;
}

#order-pure_comparison .price-table > ul > li:nth-child(2) .plan-smart-icon { animation-delay: .2s; }
#order-pure_comparison .price-table > ul > li:nth-child(3) .plan-smart-icon { animation-delay: .4s; }
#order-pure_comparison .price-table > ul > li:nth-child(4) .plan-smart-icon { animation-delay: .6s; }
#order-pure_comparison .price-table > ul > li:nth-child(5) .plan-smart-icon { animation-delay: .8s; }
#order-pure_comparison .price-table > ul > li:nth-child(6) .plan-smart-icon { animation-delay: 1s; }

@keyframes hpIconFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

#order-pure_comparison .price-table:hover .plan-smart-icon {
  color: #fff !important;
  background: linear-gradient(145deg, var(--hp-red), var(--hp-red-dark)) !important;
  transform: translateY(-4px) scale(1.06);
  box-shadow: 0 18px 36px rgba(187,48,48,.30) !important;
}

/* ================= Price + Button ================= */

#order-pure_comparison .price-area {
  position: relative !important;
  z-index: 2 !important;
  padding: 22px 32px 34px !important;
  text-align: center !important;
}

#order-pure_comparison .price {
  color: var(--hp-dark) !important;
  font-size: 39px !important;
  font-weight: 950 !important;
  margin-bottom: 20px !important;
  line-height: 1.15 !important;
  text-shadow: 0 8px 24px rgba(31,58,64,.10) !important;
}

#order-pure_comparison .price small,
#order-pure_comparison .price .js-price-suffix {
  font-size: 12px !important;
  font-weight: 900 !important;
  color: rgba(31,58,64,.70) !important;
}

#order-pure_comparison .order-button {
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  height: 54px !important;
  border-radius: 18px !important;
  background: linear-gradient(135deg, var(--hp-red), var(--hp-red-dark)) !important;
  color: #fff !important;
  border: 0 !important;
  font-size: 15px !important;
  font-weight: 950 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  box-shadow:
    0 18px 40px rgba(187,48,48,.35),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
  transition: .32s ease !important;
}

#order-pure_comparison .order-button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.32), transparent);
  transform: translateX(-120%);
  transition: .55s ease;
}

#order-pure_comparison .order-button:hover {
  color: #fff !important;
  transform: translateY(-4px) !important;
  box-shadow:
    0 28px 58px rgba(187,48,48,.44),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

#order-pure_comparison .order-button:hover::before {
  transform: translateX(120%);
}

/* Featured Card */
#order-pure_comparison .price-table.active {
  border-color: rgba(187,48,48,.42) !important;
  box-shadow:
    0 44px 115px rgba(187,48,48,.16),
    0 26px 70px rgba(31,58,64,.12) !important;
}

/* ================= Responsive ================= */

@media (max-width: 991px) {
  #order-pure_comparison .price-table-container > ul {
    grid-template-columns: 1fr !important;
    max-width: 450px !important;
  }

  #order-pure_comparison .billing-switcher {
    flex-direction: column !important;
    border-radius: 26px !important;
    text-align: center !important;
  }

  #billingCycleSelect {
    width: 100% !important;
  }
}
/* ===============================
   REMOVE GLOW / CLEAN LOOK
================================ */

/* إزالة الإضاءة الخلفية */
#order-pure_comparison .price-table::before {
  display: none !important;
}

/* إزالة الإطار اللامع الداخلي */
#order-pure_comparison .price-table::after {
  display: none !important;
}

/* إزالة الخلفيات المتوهجة */
#order-pure_comparison .price-table {
  background: #ffffff !important;
  box-shadow: 0 20px 50px rgba(31,58,64,.08) !important;
}

/* إزالة توهج hover */
#order-pure_comparison .price-table:hover {
  box-shadow: 0 25px 60px rgba(31,58,64,.12) !important;
  border-color: rgba(31,58,64,.12) !important;
}

/* إزالة توهج الأيقونات */
.plan-smart-icon {
  background: #f6f8fa !important;
  border: 1px solid rgba(31,58,64,.10) !important;
  box-shadow: none !important;
}

/* hover للأيقونات بدون glow */
#order-pure_comparison .price-table:hover .plan-smart-icon {
  background: #BB3030 !important;
  color: #fff !important;
  box-shadow: none !important;
}

/* إزالة توهج الزر */
#order-pure_comparison .order-button {
  box-shadow: none !important;
}

#order-pure_comparison .order-button:hover {
  box-shadow: none !important;
}
/* ===============================
   CARD HEIGHT + BADGE + PRICE FIX
================================ */

/* تقليل طول البطاقة */
#order-pure_comparison .top-head {
  padding: 24px 26px 14px !important;
}

#order-pure_comparison .price-table > ul {
  padding: 18px 28px 8px !important;
}

#order-pure_comparison .price-table > ul > li {
  padding: 8px 0 !important;
  gap: 12px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.plan-smart-icon {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 12px !important;
  font-size: 14px !important;
}

/* بادج الأكثر شهرة بشكل احترافي */
#order-pure_comparison .popular-plan {
  margin-top: 14px !important;
}

#order-pure_comparison .popular-plan .txt-container {
  width: fit-content !important;
  min-width: 170px !important;
  height: 34px !important;
  margin: 0 auto !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  background: #BB3030 !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
  position: relative !important;
}

#order-pure_comparison .popular-plan .txt-container::before {
  content: "★";
  margin-inline-end: 7px;
  font-size: 11px;
}

/* منطقة السعر أجمل وأقصر */
#order-pure_comparison .price-area {
  padding: 18px 28px 26px !important;
  text-align: center !important;
}

#order-pure_comparison .price {
  margin-bottom: 14px !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

#order-pure_comparison .price span,
#order-pure_comparison .price .js-price-text {
  font-size: 34px !important;
  font-weight: 950 !important;
  color: #1F3A40 !important;
}

#order-pure_comparison .price small,
#order-pure_comparison .price .js-price-suffix {
  display: inline-block !important;
  margin-inline-start: 5px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  color: rgba(31,58,64,.72) !important;
}

#order-pure_comparison .js-effective-monthly {
  display: block !important;
  margin-top: 6px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  color: rgba(31,58,64,.58) !important;
}

/* الزر في المنتصف وليس عريض جداً */
#order-pure_comparison .order-button {
  width: auto !important;
  min-width: 190px !important;
  height: 50px !important;
  margin: 0 auto !important;
  padding: 0 28px !important;
  border-radius: 16px !important;
  display: inline-flex !important;
}

/* البطاقة نفسها أكثر توازن */
#order-pure_comparison .price-table {
  min-height: auto !important;
  height: auto !important;
}

#order-pure_comparison .top-area h4 {
  font-size: 27px !important;
}
/* ===============================
   FIX DROPDOWN OVER CARDS
================================ */

/* رفع الكومبو فوق كل شيء */
#order-pure_comparison .billing-switcher {
  position: relative !important;
  z-index: 9999 !important;
}

/* القائمة المنسدلة نفسها */
#billingCycleSelect {
  position: relative !important;
  z-index: 10000 !important;
}

/* مهم: خفض z-index البطاقات */
#order-pure_comparison .price-table {
  position: relative !important;
  z-index: 1 !important;
}
.premium-select-list {
  min-height: auto !important;
}

.premium-select-option {
  display: block !important;
}   
/* ===============================
   GLOBAL STRONG PREMIUM MOTION
================================ */

html {
  scroll-behavior: smooth;
}

/* حركة دخول عامة */
body main,
section,
.container,
.row,
.panel,
.card,
.price-table,
.compare-box,
.footer,
.hp-section {
  animation: globalFadeUp .85s cubic-bezier(.22,1,.36,1) both;
}

@keyframes globalFadeUp {
  from {
    opacity: 0;
    transform: translateY(38px) scale(.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Hover عام أقوى */
a,
button,
.btn,
.order-button,
input,
select,
textarea,
.card,
.panel,
.price-table,
.hp-card,
.hp-feature-card,
.hp-presence-card {
  transition:
    transform .32s cubic-bezier(.22,1,.36,1),
    box-shadow .32s ease,
    background .32s ease,
    border-color .32s ease,
    color .32s ease !important;
}

a:hover,
button:hover,
.btn:hover,
.order-button:hover {
  transform: translateY(-3px) scale(1.015);
}

/* الكروت تطفو */
.card:hover,
.panel:hover,
.price-table:hover,
.hp-card:hover,
.hp-feature-card:hover,
.hp-presence-card:hover {
  transform: translateY(-10px) scale(1.015) !important;
}

/* أزرار نابضة */
.btn-primary,
.order-button,
.hp-main-btn,
.hp-btn-primary {
  position: relative !important;
  overflow: hidden !important;
  animation: globalButtonPulse 2.8s ease-in-out infinite;
}

@keyframes globalButtonPulse {
  0%,100% {
    box-shadow: 0 12px 28px rgba(187,48,48,.25);
  }
  50% {
    box-shadow: 0 18px 42px rgba(187,48,48,.42);
  }
}

/* لمعة تمر على الأزرار */
.btn-primary::before,
.order-button::before,
.hp-main-btn::before,
.hp-btn-primary::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.34), transparent);
  transform: translateX(-120%);
  transition: .65s ease;
}

.btn-primary:hover::before,
.order-button:hover::before,
.hp-main-btn:hover::before,
.hp-btn-primary:hover::before {
  transform: translateX(120%);
}

/* أيقونات عائمة */
i,
svg,
img {
  transition: transform .35s ease, filter .35s ease !important;
}

a:hover i,
button:hover i,
.btn:hover i,
.card:hover i,
.panel:hover i,
.price-table:hover i,
.hp-card:hover i,
.hp-feature-card:hover i {
  transform: translateY(-3px) scale(1.08);
}

/* Inputs focus احترافي */
input:focus,
select:focus,
textarea:focus {
  transform: translateY(-2px);
  box-shadow: 0 0 0 5px rgba(187,48,48,.08) !important;
  border-color: rgba(187,48,48,.45) !important;
}

/* تأخير بسيط للعناصر المتكررة */
.row > div:nth-child(1),
.price-table-container > ul > li:nth-child(1) {
  animation-delay: .05s;
}

.row > div:nth-child(2),
.price-table-container > ul > li:nth-child(2) {
  animation-delay: .14s;
}

.row > div:nth-child(3),
.price-table-container > ul > li:nth-child(3) {
  animation-delay: .23s;
}

.row > div:nth-child(4),
.price-table-container > ul > li:nth-child(4) {
  animation-delay: .32s;
}

/* حركة خفيفة مستمرة للكروت المهمة */
.price-table,
.hp-presence-card,
.hp-feature-card {
  animation:
    globalFadeUp .85s cubic-bezier(.22,1,.36,1) both,
    globalFloat 6s ease-in-out infinite;
}

.price-table:nth-child(2),
.hp-presence-card:nth-child(2),
.hp-feature-card:nth-child(2) {
  animation-delay: .12s, 1s;
}

.price-table:nth-child(3),
.hp-presence-card:nth-child(3),
.hp-feature-card:nth-child(3) {
  animation-delay: .22s, 2s;
}

@keyframes globalFloat {
  0%,100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-7px);
  }
}

/* منع الحركة الزائدة على الجداول */
table,
table *,
.navbar,
.navbar * {
  animation: none !important;
}

/* احترام إعدادات تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

.pro-compare-wrap {
    width: 100% !important;
    padding: 35px 0 !important;
}

.pro-compare-card {
    background: #ffffff !important;
    border-radius: 26px !important;
    border: 1px solid rgba(31, 58, 64, .10) !important;
    box-shadow: 0 25px 70px rgba(31, 58, 64, .10) !important;
    overflow: hidden !important;
}

.pro-compare-responsive {
    margin: 0 !important;
    border: 0 !important;
}

.pro-compare-table {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #fff !important;
    color: #1F3A40 !important;
    font-family: var(--CairoFont), sans-serif !important;
}

.pro-compare-table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 2 !important;
    background: linear-gradient(135deg, #1F3A40, #13282d) !important;
    color: #fff !important;
    text-align: center !important;
    padding: 22px 18px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    border: 0 !important;
    white-space: nowrap !important;
}

.pro-compare-table thead th:first-child {
    text-align: right !important;
    border-radius: 0 !important;
}

.pro-compare-table thead th span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pro-compare-table thead th.popular-plan {
    background: linear-gradient(135deg, #BB3030, #8f2020) !important;
    position: relative !important;
}

.pro-compare-table thead th.popular-plan::after {
    content: "★" !important;
    position: absolute !important;
    top: 8px !important;
    inset-inline-end: 12px !important;
    font-size: 13px !important;
    color: #fff !important;
    opacity: .9 !important;
}

.pro-compare-table tbody td {
    padding: 17px 18px !important;
    text-align: center !important;
    vertical-align: middle !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(31, 58, 64, .08) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    background: #fff !important;
    transition: .25s ease !important;
}

.pro-compare-table tbody td:first-child {
    text-align: right !important;
    color: #1F3A40 !important;
    background: #fbfbfc !important;
    min-width: 240px !important;
    font-weight: 800 !important;
}

.pro-compare-table tbody tr:hover td {
    background: rgba(187, 48, 48, .045) !important;
}

.pro-compare-table tbody tr:hover td:first-child {
    background: rgba(31, 58, 64, .055) !important;
}

.pro-compare-table .yes,
.pro-compare-table .no {
    font-size: 0 !important;
}

.pro-compare-table .yes::before,
.pro-compare-table .no::before {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 15px !important;
    font-weight: 900 !important;
}

.pro-compare-table .yes::before {
    content: "✓" !important;
    color: #fff !important;
    background: linear-gradient(135deg, #1F3A40, #2e5961) !important;
    box-shadow: 0 8px 18px rgba(31, 58, 64, .18) !important;
}

.pro-compare-table .no::before {
    content: "×" !important;
    color: #BB3030 !important;
    background: rgba(187, 48, 48, .10) !important;
}

.pro-compare-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

@media (max-width: 768px) {
    .pro-compare-wrap {
        padding: 20px 0 !important;
    }

    .pro-compare-card {
        border-radius: 20px !important;
    }

    .pro-compare-table {
        min-width: 760px !important;
    }

    .pro-compare-table thead th {
        padding: 18px 14px !important;
        font-size: 14px !important;
    }

    .pro-compare-table tbody td {
        padding: 15px 14px !important;
        font-size: 14px !important;
    }

    .pro-compare-table tbody td:first-child {
        min-width: 220px !important;
    }
}
.compare-box {
  max-width: 1120px !important;
  margin: 35px auto 45px !important;
  padding: 0 20px !important;
}

.compare-header {
  height: 72px !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, #1F3A40, #10242a) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 22px 55px rgba(31,58,64,.18) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 26px !important;
  cursor: pointer !important;
  transition: .3s ease !important;
}

.compare-header:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 28px 70px rgba(31,58,64,.24) !important;
}

.compare-header span:first-child {
  font-size: 17px !important;
  font-weight: 900 !important;
  letter-spacing: .2px !important;
}

.compare-header span:first-child::before {
  content: "\f080" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  width: 42px !important;
  height: 42px !important;
  margin-inline-end: 12px !important;
  border-radius: 14px !important;
  background: rgba(187,48,48,.95) !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 12px 28px rgba(187,48,48,.25) !important;
}

.compare-header .arrow {
  width: 42px !important;
  height: 42px !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.10) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: .3s ease !important;
}

.compare-header .arrow::before {
  content: "\f078" !important;
  font-family: "Font Awesome 6 Free" !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  color: #fff !important;
}

.compare-header[aria-expanded="true"] {
  border-radius: 22px 22px 0 0 !important;
}

.compare-header[aria-expanded="true"] .arrow {
  background: #BB3030 !important;
  transform: rotate(180deg) !important;
}

#comparePlans {
  background: #fff !important;
  border-radius: 0 0 24px 24px !important;
  box-shadow: 0 25px 70px rgba(31,58,64,.10) !important;
}

@media (max-width: 768px) {
  .compare-box {
    padding: 0 15px !important;
  }

  .compare-header {
    height: 64px !important;
    padding: 0 16px !important;
    border-radius: 18px !important;
  }

  .compare-header span:first-child {
    font-size: 14px !important;
  }

  .compare-header span:first-child::before,
  .compare-header .arrow {
    width: 36px !important;
    height: 36px !important;
    border-radius: 12px !important;
  }
  /*تنسيق صفحة تسجيل الدخول*/
}.diprella-login-page {
    width: 100%;
    min-height: 75vh;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    background-color: #ecf0f3;
    color: #a0a5a8;
    padding: 40px 15px;
}

.diprella-main {
    position: relative;
    width: 1000px;
    min-width: 1000px;
    min-height: 600px;
    height: 600px;
    padding: 25px;
    background-color: #ecf0f3;
    box-shadow: 10px 10px 10px #d1d9e6, -10px -10px 10px #f9f9f9;
    border-radius: 12px;
    overflow: hidden;
}

.diprella-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    width: 600px;
    height: 100%;
    padding: 25px;
    background-color: #ecf0f3;
    transition: 1.25s;
}

.diprella-form {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.form__input {
    width: 350px;
    height: 40px;
    margin: 4px 0;
    padding-left: 25px;
    padding-right: 25px;
    font-size: 13px;
    border: none;
    outline: none;
    background-color: #ecf0f3;
    border-radius: 8px;
    box-shadow: inset 2px 2px 4px #d1d9e6, inset -2px -2px 4px #f9f9f9;
}

.form__input:focus {
    box-shadow: inset 4px 4px 4px #d1d9e6, inset -4px -4px 4px #f9f9f9;
}

.form__span {
    margin-top: 15px;
    margin-bottom: 12px;
}

.form__link {
    color: #181818;
    font-size: 14px;
    margin-top: 18px;
    border-bottom: 1px solid #a0a5a8;
    line-height: 2;
}

.title {
    font-size: 34px;
    font-weight: 700;
    line-height: 1.5;
    color: #181818;
    text-align: center;
}

.description {
    font-size: 14px;
    letter-spacing: .25px;
    text-align: center;
    line-height: 1.6;
}

.button {
    width: 180px;
    height: 50px;
    border-radius: 25px;
    margin-top: 35px;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 1.15px;
    background-color: #4B70E2;
    color: #f9f9f9;
    box-shadow: 8px 8px 16px #d1d9e6, -8px -8px 16px #f9f9f9;
    border: none;
    outline: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.button:hover {
    color: #fff;
    text-decoration: none;
}

.a-container {
    z-index: 100;
    left: calc(100% - 600px);
}

.b-container {
    left: calc(100% - 600px);
    z-index: 0;
}

.switch {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 400px;
    padding: 50px;
    z-index: 200;
    transition: 1.25s;
    background-color: #ecf0f3;
    overflow: hidden;
    box-shadow: 4px 4px 10px #d1d9e6, -4px -4px 10px #f9f9f9;
}

.switch__circle {
    position: absolute;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background-color: #ecf0f3;
    box-shadow: inset 8px 8px 12px #d1d9e6, inset -8px -8px 12px #f9f9f9;
    bottom: -60%;
    left: -60%;
    transition: 1.25s;
}

.switch__circle--t {
    top: -30%;
    left: 60%;
    width: 300px;
    height: 300px;
}

.switch__container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: absolute;
    width: 400px;
    padding: 50px 55px;
    transition: 1.25s;
}

.switch__button {
    cursor: pointer;
}

.is-txr {
    left: calc(100% - 400px);
    transition: 1.25s;
    transform-origin: left;
}

.is-txl {
    left: 0;
    transition: 1.25s;
    transform-origin: right;
}

.is-z200 {
    z-index: 200;
    transition: 1.25s;
}

.is-hidden {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    transition: 1.25s;
}

.is-gx {
    animation: is-gx 1.25s;
}

@keyframes is-gx {
    0%, 10%, 100% {
        width: 400px;
    }

    30%, 50% {
        width: 500px;
    }
}

.password-field {
    position: relative;
}

.btn-reveal-pw {
    position: absolute;
    right: 12px;
    top: 8px;
    border: 0;
    background: transparent;
    color: #777;
}

.remember-me {
    margin-top: 14px;
    color: #181818;
}

.captcha-wrapper {
    width: 350px;
    margin-top: 15px;
}

@media (max-width: 1200px) {
    .diprella-main {
        transform: scale(.8);
    }
}

@media (max-width: 768px) {
    .diprella-main {
        width: 100%;
        min-width: unset;
        height: auto;
        min-height: auto;
        transform: none;
        padding: 25px;
    }

    .switch,
    .a-container {
        display: none;
    }

    .b-container {
        position: relative;
        left: auto;
        width: 100%;
        height: auto;
        z-index: 1;
    }

    .form__input,
    .captcha-wrapper {
        width: 100%;
        max-width: 350px;
    }
}/* الخلفية */
.diprella-login-page {
    background: var(--BackgroundColor);
}

/* الكارد الرئيسي */
.diprella-main {
    background: #fff;
    box-shadow: var(--ShadowGray);
}

/* العناوين */
.title {
    color: var(--TextDark);
}

/* النصوص */
.description,
.form__span {
    color: var(--TextDark);
    opacity: 0.7;
}

/* الحقول */
.form__input {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.08);
    color: var(--TextDark);
    transition: 0.3s;
}

.form__input:focus {
    border-color: var(--PrimaryColor);
    box-shadow: 0 0 0 2px rgba(187, 48, 48, 0.15);
}

/* رابط نسيت كلمة المرور */
.form__link {
    color: var(--PrimaryColor);
    border-bottom-color: var(--PrimaryColor);
}

.form__link:hover {
    color: var(--hover);
    border-bottom-color: var(--hover);
}

/* زر تسجيل الدخول */
.button {
    background: linear-gradient(
        135deg,
        var(--PrimaryColor),
        var(--SecondaryColor)
    );
    color: var(--TextBright);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

.button:hover {
    background: linear-gradient(
        135deg,
        var(--hover),
        var(--SecondaryColor)
    );
}

/* switch (الجزء الجانبي) */
.switch {
    background: linear-gradient(
        135deg,
        var(--PrimaryColor),
        var(--SecondaryColor)
    );
    color: var(--TextBright);
}

/* نص switch */
.switch__title,
.switch__description {
    color: var(--TextBright);
}

/* الدوائر */
.switch__circle {
    background: rgba(255,255,255,0.1);
}

/* checkbox */
.remember-me {
    color: var(--TextDark);
}

/* زر اظهار الباسورد */
.btn-reveal-pw {
    color: var(--TextDark);
    opacity: 0.6;
}

.btn-reveal-pw:hover {
    color: var(--PrimaryColor);
}

/* CAPTCHA */
.captcha-wrapper {
    border-radius: 10px;
    padding: 10px;
}

/* تحسين الخط */
body {
    font-family: var(--CairoFont);
}.button {
    background: var(--PrimaryColor);
}

.button:hover {
    background: var(--hover);
}
  /*نهاية تنسيق صفحة تسجيل الدخول*/
    /*تنسيق صفحة  تعبئة بيانات مستخدم جديد*/
    /* Horanos Register - Professional UI */

.horanos-register-page {
    min-height: 80vh;
    padding: 55px 16px;
    background:
        radial-gradient(circle at top right, rgba(187,48,48,.10), transparent 32%),
        radial-gradient(circle at bottom left, rgba(31,58,64,.12), transparent 35%),
        var(--BackgroundColor);
    font-family: var(--CairoFont);
}

.horanos-register-wrapper {
    max-width: 1080px;
    margin: 0 auto;
}

.horanos-register-header {
    position: relative;
    overflow: hidden;
    padding: 42px 34px;
    margin-bottom: 32px;
    border-radius: 28px;
    background: linear-gradient(135deg, var(--SecondaryColor), #13292e);
    box-shadow: var(--ShadowGray);
    text-align: center;
}

.horanos-register-header::before {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    top: -120px;
    right: -80px;
    border-radius: 50%;
    background: rgba(187,48,48,.35);
}

.horanos-register-header::after {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    bottom: -90px;
    left: -40px;
    border-radius: 50%;
    background: rgba(255,255,255,.10);
}

.horanos-register-header h1,
.horanos-register-header p {
    position: relative;
    z-index: 1;
}

.horanos-register-header h1 {
    margin: 0 0 10px;
    color: var(--TextBright);
    font-size: 36px;
    font-weight: 900;
    letter-spacing: -.5px;
}

.horanos-register-header p {
    margin: 0;
    color: rgba(255,255,255,.78);
    font-size: 15px;
}

/* Cards */
.horanos-card {
    position: relative;
    padding: 32px;
    margin-bottom: 28px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(31,58,64,.08);
    border-radius: 26px;
    box-shadow: 0 18px 45px rgba(31,58,64,.08);
    backdrop-filter: blur(10px);
    transition: .25s ease;
}

.horanos-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 24px 55px rgba(31,58,64,.12);
}

.horanos-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 18px;
    margin-bottom: 26px;
    border-bottom: 1px solid rgba(31,58,64,.08);
}

.horanos-card-header span {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(187,48,48,.16), rgba(187,48,48,.06));
    color: var(--PrimaryColor);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.horanos-card-header h3 {
    margin: 0;
    color: var(--TextDark);
    font-size: 24px;
    font-weight: 900;
}

/* Inputs */
.horanos-register-page .form-group {
    margin-bottom: 18px;
}

.horanos-register-page .prepend-icon {
    position: relative;
}

.horanos-register-page .field-icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 52px;
    height: 52px;
    z-index: 2;
    color: rgba(31,58,64,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.horanos-register-page .field,
.horanos-register-page .form-control,
.horanos-register-page select,
.horanos-register-page textarea {
    width: 100%;
    min-height: 52px;
    border-radius: 16px !important;
    border: 1px solid rgba(31,58,64,.14);
    background: #fff;
    color: var(--TextDark);
    padding: 0 52px 0 16px;
    box-shadow: 0 8px 22px rgba(31,58,64,.04) !important;
    transition: .22s ease;
    font-family: var(--CairoFont);
}

.horanos-register-page textarea {
    min-height: 120px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.horanos-register-page .field:hover,
.horanos-register-page .form-control:hover,
.horanos-register-page select:hover {
    border-color: rgba(187,48,48,.35);
}

.horanos-register-page .field:focus,
.horanos-register-page .form-control:focus,
.horanos-register-page select:focus,
.horanos-register-page textarea:focus {
    border-color: var(--PrimaryColor);
    box-shadow: 0 0 0 4px rgba(187,48,48,.12), 0 10px 25px rgba(31,58,64,.06) !important;
    outline: none;
}

.horanos-register-page .field::placeholder,
.horanos-register-page .form-control::placeholder {
    color: rgba(31,58,64,.42);
}

/* Password eye */
.password-field .btn-reveal-pw {
    position: absolute;
    top: 9px;
    left: 10px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 12px;
    background: rgba(31,58,64,.05);
    color: rgba(31,58,64,.55);
    z-index: 5;
    cursor: pointer;
    transition: .2s ease;
}

.password-field .btn-reveal-pw:hover {
    background: rgba(187,48,48,.10);
    color: var(--PrimaryColor);
}

.password-field input {
    padding-left: 52px !important;
}

/* Buttons */
.horanos-register-page .btn-primary,
.horanos-register-submit {
    min-width: 220px;
    background: linear-gradient(135deg, var(--PrimaryColor), var(--hover)) !important;
    border: 0 !important;
    color: var(--TextBright) !important;
    border-radius: 18px !important;
    padding: 15px 42px !important;
    font-weight: 900;
    letter-spacing: .2px;
    box-shadow: 0 16px 32px rgba(187,48,48,.30);
    transition: .22s ease;
}

.horanos-register-page .btn-primary:hover,
.horanos-register-submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 40px rgba(187,48,48,.38);
}

.generate-password {
    min-height: 44px;
    border-radius: 14px !important;
    background: #fff;
    border: 1px solid rgba(31,58,64,.14);
    color: var(--TextDark);
    font-weight: 800;
    transition: .2s ease;
}

.generate-password:hover {
    background: var(--SecondaryColor);
    color: #fff;
    border-color: var(--SecondaryColor);
}

/* Password strength */
.horanos-register-page .progress {
    height: 11px;
    border-radius: 999px;
    background: #edf0f2;
    overflow: hidden;
}

.horanos-register-page .progress-bar {
    background: linear-gradient(90deg, var(--PrimaryColor), var(--SecondaryColor)) !important;
}

.horanos-register-page .password-strength-meter {
    padding: 12px 14px;
    border-radius: 16px;
    background: rgba(31,58,64,.04);
}

/* Captcha / TOS */
.horanos-captcha {
    margin: 26px 0;
    display: flex;
    justify-content: center;
}

.horanos-tos {
    color: var(--TextDark);
}

.horanos-tos a {
    color: var(--PrimaryColor);
    font-weight: 900;
}

.horanos-register-page .alert {
    border-radius: 18px;
    border: 0;
    box-shadow: 0 10px 28px rgba(31,58,64,.08);
}

.horanos-register-page .field-help-text,
.horanos-register-page .text-muted {
    color: rgba(31,58,64,.62) !important;
}

.horanos-register-page .intl-tel-input,
.horanos-register-page .iti {
    width: 100%;
}

/* Linked accounts area */
.horanos-register-page .providerLinkingFeedback,
.horanos-register-page .linked-accounts {
    margin-bottom: 20px;
}

/* Mobile */
@media (max-width: 768px) {
    .horanos-register-page {
        padding: 28px 12px;
    }

    .horanos-register-header {
        padding: 32px 20px;
        border-radius: 22px;
    }

    .horanos-register-header h1 {
        font-size: 28px;
    }

    .horanos-card {
        padding: 22px 16px;
        border-radius: 22px;
    }

    .horanos-card:hover {
        transform: none;
    }

    .horanos-card-header {
        gap: 10px;
    }

    .horanos-card-header span {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }

    .horanos-card-header h3 {
        font-size: 20px;
    }

    .horanos-register-page .field,
    .horanos-register-page .form-control,
    .horanos-register-page select {
        min-height: 48px;
    }

    .horanos-register-page .field-icon {
        height: 48px;
    }

    .horanos-register-page .btn-primary,
    .horanos-register-submit {
        width: 100%;
        min-width: 0;
    }
}/* Professional polish over previous register style */

/* خلفية أنعم */
.horanos-register-page {
    background:
        radial-gradient(circle at 10% 10%, rgba(187,48,48,.08), transparent 28%),
        radial-gradient(circle at 90% 20%, rgba(31,58,64,.10), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, var(--BackgroundColor) 100%);
}

/* هيدر أفخم بدون ظلام زائد */
.horanos-register-header {
    border: 1px solid rgba(255,255,255,.22);
    background:
        linear-gradient(135deg, rgba(31,58,64,.98), rgba(31,58,64,.92)),
        linear-gradient(45deg, rgba(187,48,48,.35), transparent);
}

.horanos-register-header h1 {
    letter-spacing: -0.8px;
}

.horanos-register-header p {
    max-width: 620px;
    margin: 0 auto;
}

/* كروت أنظف */
.horanos-card {
    border: 1px solid rgba(31,58,64,.07);
    box-shadow:
        0 18px 45px rgba(31,58,64,.07),
        0 1px 0 rgba(255,255,255,.9) inset;
}

.horanos-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 32px;
    left: 32px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, transparent, var(--PrimaryColor), transparent);
}

/* أيقونة القسم */
.horanos-card-header span {
    box-shadow: 0 10px 24px rgba(187,48,48,.14);
}

/* الحقول */
.horanos-register-page .field,
.horanos-register-page .form-control,
.horanos-register-page select,
.horanos-register-page textarea {
    background: #fbfcfd;
    border-color: rgba(31,58,64,.11);
}

.horanos-register-page .field:focus,
.horanos-register-page .form-control:focus,
.horanos-register-page select:focus,
.horanos-register-page textarea:focus {
    background: #fff;
    transform: translateY(-1px);
}

/* زر التسجيل */
.horanos-register-page .btn-primary,
.horanos-register-submit {
    position: relative;
    overflow: hidden;
}

.horanos-register-page .btn-primary::before,
.horanos-register-submit::before {
    content: "";
    position: absolute;
    top: 0;
    right: -80%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.28), transparent);
    transform: skewX(-20deg);
    transition: .55s;
}

.horanos-register-page .btn-primary:hover::before,
.horanos-register-submit:hover::before {
    right: 120%;
}

/* زر توليد كلمة المرور */
.generate-password {
    box-shadow: 0 8px 18px rgba(31,58,64,.06);
}

/* التحقق والشروط */
.horanos-captcha,
.horanos-tos {
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(31,58,64,.07);
    border-radius: 18px;
    padding: 18px;
}

/* تنسيق نموذج نسيت كلمة المرور*/
.horanos-reset-page {
    min-height: 70vh;
    padding: 55px 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    background:
      transparent 
    
}

.horanos-reset-card {
    position: relative;
    width: 100%;
    max-width: 560px;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(31,58,64,.08);
    border-radius: 28px;
    box-shadow:
        0 18px 45px rgba(31,58,64,.08),
        0 1px 0 rgba(255,255,255,.9) inset;
    overflow: hidden;
}

.horanos-reset-accent {
    height: 5px;
    background: linear-gradient(90deg, transparent, var(--PrimaryColor), transparent);
}

.horanos-reset-body {
    padding: 44px;
}

.horanos-reset-card h1,
.horanos-reset-card h2,
.horanos-reset-card h3,
.horanos-reset-card .h3 {
    color: var(--TextDark);
    font-weight: 900;
    font-size: 28px;
}

.horanos-reset-card p,
.horanos-reset-card .text-muted {
    color: rgba(31,58,64,.68) !important;
    line-height: 1.8;
}

.horanos-reset-card label {
    color: var(--TextDark);
    font-weight: 800;
}

.horanos-reset-card .input-group {
    border-radius: 16px;
    background: #fbfcfd;
    box-shadow: 0 8px 22px rgba(31,58,64,.04);
}

.horanos-reset-card .input-group-text {
    height: 52px;
    background: rgba(31,58,64,.05) !important;
    border-color: rgba(31,58,64,.14) !important;
    color: var(--SecondaryColor) !important;
}

.horanos-reset-card .form-control {
    height: 52px !important;
    border-color: rgba(31,58,64,.14) !important;
    background: #fbfcfd !important;
    color: var(--TextDark) !important;
    box-shadow: none !important;
}

.horanos-reset-card .form-control:focus {
    background: #fff !important;
    border-color: var(--PrimaryColor) !important;
    box-shadow: 0 0 0 4px rgba(187,48,48,.12) !important;
}

.horanos-reset-card .btn-primary,
.horanos-reset-card button[type="submit"] {
    background: linear-gradient(135deg, var(--PrimaryColor), var(--hover)) !important;
    border: 0 !important;
    color: #fff !important;
    border-radius: 16px !important;
    padding: 13px 34px !important;
    font-weight: 900 !important;
    box-shadow: 0 16px 32px rgba(187,48,48,.30) !important;
    transition: .22s ease;
}

.horanos-reset-card .btn-primary:hover,
.horanos-reset-card button[type="submit"]:hover {
    transform: translateY(-2px);
}

.horanos-reset-card .alert {
    border-radius: 16px;
    border: 0;
}

@media (max-width: 768px) {
    .horanos-reset-body {
        padding: 30px 20px;
    }

    .horanos-reset-card {
        border-radius: 22px;
    }
}
/*Vps تنسيق*/
/* VPS Coming Soon */

.horanos-coming-wrapper {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background:
        transparent;
}

.horanos-coming-card {
    max-width: 720px;
    width: 100%;
    background: #fff;
    padding: 60px 40px;
    border-radius: 28px;
    text-align: center;
    box-shadow: 0 25px 60px rgba(31,58,64,.12);
    border: 1px solid rgba(31,58,64,.08);
    position: relative;
    overflow: hidden;
}

.horanos-coming-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 60px;
    left: 60px;
    height: 4px;
    background: linear-gradient(90deg, transparent, var(--PrimaryColor), transparent);
}

.horanos-coming-icon {
    width: 85px;
    height: 85px;
    margin: 0 auto 25px;
    border-radius: 22px;
    background: rgba(187,48,48,.10);
    color: var(--PrimaryColor);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 36px;
}

.horanos-coming-card h1 {
    font-size: 42px;
    font-weight: 900;
    color: var(--TextDark);
    margin-bottom: 15px;
}

.horanos-coming-card p {
    font-size: 17px;
    color: rgba(31,58,64,.7);
    line-height: 1.8;
    margin-bottom: 30px;
}

/* Buttons */
.horanos-coming-actions {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

.btn-main {
    background: var(--PrimaryColor);
    color: #fff;
    padding: 14px 28px;
    border-radius: 16px;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 15px 30px rgba(187,48,48,.25);
    transition: .25s;
}

.btn-main:hover {
    background: var(--hover);
    color: #fff;
    transform: translateY(-2px);
}

.btn-outline {
    border: 1px solid rgba(31,58,64,.2);
    color: var(--TextDark);
    padding: 14px 28px;
    border-radius: 16px;
    font-weight: 900;
    text-decoration: none;
    transition: .25s;
}

.btn-outline:hover {
    border-color: var(--PrimaryColor);
    color: var(--PrimaryColor);
}

/* موبايل */
@media (max-width: 768px) {
    .horanos-coming-card {
        padding: 40px 20px;
        border-radius: 22px;
    }

    .horanos-coming-card h1 {
        font-size: 30px;
    }
}
/* Contact Us قسم ال  */
.contact-modern-card {
    border: 0;
    border-radius: 26px;
    background:
        radial-gradient(circle at top left, rgba(196, 49, 53, 0.08), transparent 35%),
        linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    overflow: hidden;
}

.contact-modern-body {
    padding: 55px 35px;
}

.contact-modern-header {
    text-align: center;
    max-width: 720px;
    margin: 0 auto 40px;
}

.contact-modern-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 16px;
    margin-bottom: 14px;
    border-radius: 999px;
    background: rgba(196, 49, 53, 0.1);
    color: #c43135;
    font-size: 14px;
    font-weight: 800;
}

.contact-modern-header h1 {
    margin: 0 0 12px;
    color: #1f2937;
    font-size: 40px;
    font-weight: 800;
    letter-spacing: -0.5px;
}

.contact-modern-header p {
    margin: 0;
    color: #6b7280;
    font-size: 18px;
    line-height: 1.8;
}

.contact-modern-grid {
    display: grid;
    grid-template-columns: 0.9fr 1.35fr;
    gap: 28px;
    max-width: 1180px;
    margin: 0 auto;
}

.contact-info-panel,
.contact-form-panel {
    border-radius: 24px;
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.09);
}

.contact-info-panel {
    position: relative;
    overflow: hidden;
    background: linear-gradient(160deg, #c43135 0%, #7f1d1d 100%);
    color: #fff;
}

.contact-info-panel:before {
    content: "";
    position: absolute;
    top: -80px;
    right: -80px;
    width: 190px;
    height: 190px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
}

.contact-info-panel:after {
    content: "";
    position: absolute;
    bottom: -90px;
    left: -70px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
}

.contact-info-content {
    position: relative;
    z-index: 2;
    padding: 38px;
}

.contact-info-content h3 {
    margin: 0 0 14px;
    font-size: 28px;
    font-weight: 800;
}

.contact-info-content > p {
    margin-bottom: 34px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 15px;
    line-height: 1.9;
}

.contact-info-item {
    display: flex;
    gap: 15px;
    align-items: flex-start;
    margin-bottom: 24px;
}

.contact-info-item:last-child {
    margin-bottom: 0;
}

.contact-info-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.16);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-info-icon i {
    font-size: 18px;
}

.contact-info-item strong {
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: 800;
}

.contact-info-item span {
    display: block;
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
    line-height: 1.6;
}

.contact-form-panel {
    background: #fff;
    padding: 38px;
}

.contact-modern-form .form-group {
    margin-bottom: 20px;
}

.contact-modern-form label {
    display: block;
    margin-bottom: 9px;
    color: #263238;
    font-size: 14px;
    font-weight: 800;
}

.contact-input-wrap {
    position: relative;
}

.contact-input-wrap i {
    position: absolute;
    top: 50%;
    left: 17px;
    transform: translateY(-50%);
    color: #9ca3af;
    font-size: 15px;
    pointer-events: none;
}

.contact-input-wrap .form-control {
    padding-left: 45px;
}

.contact-modern-form .form-control {
    width: 100%;
    height: auto;
    min-height: 52px;
    border: 1px solid #d9dee7;
    border-radius: 14px;
    background: #f9fafb;
    color: #1f2937;
    padding-top: 14px;
    padding-bottom: 14px;
    font-size: 15px;
    transition: all 0.25s ease;
}

.contact-modern-form .form-control:focus {
    border-color: #c43135;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(196, 49, 53, 0.12);
}

.contact-modern-textarea {
    min-height: 165px;
    resize: vertical;
}

.contact-captcha {
    margin: 22px 0;
    text-align: center;
}

.contact-submit-wrap {
    display: flex;
    justify-content: flex-start;
}

.contact-submit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 14px;
    background: #c43135;
    color: #fff;
    padding: 15px 34px;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: 0 16px 35px rgba(196, 49, 53, 0.28);
}

.contact-submit-btn:hover,
.contact-submit-btn:focus {
    background: #a7282c;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 20px 42px rgba(196, 49, 53, 0.35);
}

@media (max-width: 991px) {
    .contact-modern-body {
        padding: 40px 20px;
    }

    .contact-modern-grid {
        grid-template-columns: 1fr;
    }

    .contact-modern-header h1 {
        font-size: 32px;
    }
}

@media (max-width: 575px) {
    .contact-modern-body {
        padding: 30px 14px;
    }

    .contact-form-panel,
    .contact-info-content {
        padding: 24px;
    }

    .contact-submit-wrap {
        display: block;
    }

    .contact-submit-btn {
        width: 100%;
    }
}
/* نهاية Contact Us قسم ال    */

/* knowledgebase قسم ال  */
.kb-modern {
    padding: 10px 0 40px;
}

.kb-hero {
    margin-bottom: 28px;
    padding: 34px;
    border-radius: 26px;
    background:
        radial-gradient(circle at top right, rgba(196, 49, 53, 0.12), transparent 30%),
        linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
}

.kb-hero-text {
    text-align: center;
    margin-bottom: 24px;
}

.kb-hero-badge {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(196, 49, 53, 0.10);
    color: #c43135;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 12px;
}

.kb-hero-text h1 {
    margin: 0 0 10px;
    font-size: 38px;
    font-weight: 800;
    color: #1f2937;
}

.kb-hero-text p {
    margin: 0;
    font-size: 16px;
    color: #6b7280;
    line-height: 1.8;
}

.kb-search-form {
    max-width: 100%;
    margin: 0 auto;
}

.kb-search-box {
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

.kb-search-box i {
    position: absolute;
    left: 18px;
    color: #9ca3af;
    font-size: 16px;
}

.kb-search-box input {
    flex: 1;
    width: 100%;
    border: 0;
    outline: none;
    min-height: 58px;
    padding: 0 18px 0 50px;
    font-size: 16px;
    color: #1f2937;
    background: transparent;
}

.kb-search-box button {
    border: 0;
    min-width: 125px;
    min-height: 58px;
    background: #c43135;
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    transition: 0.25s ease;
}

.kb-search-box button:hover {
    background: #a7282c;
}

.kb-section-head {
    margin: 0 0 20px;
}

.kb-section-head h2 {
    margin: 0 0 6px;
    font-size: 28px;
    font-weight: 800;
    color: #1f2937;
}

.kb-section-head p {
    margin: 0;
    color: #6b7280;
    font-size: 15px;
}

.kb-category-card {
    display: block;
    height: 100%;
    padding: 24px;
    border-radius: 22px;
    background: #fff;
    border: 1px solid #edf0f5;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.06);
    text-decoration: none !important;
    transition: 0.25s ease;
}

.kb-category-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 48px rgba(15, 23, 42, 0.10);
    border-color: rgba(196, 49, 53, 0.18);
}

.kb-category-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.kb-category-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    background: rgba(53, 94, 152, 0.10);
    color: #355e98;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
}

.kb-category-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: 999px;
    background: #1fa3c4;
    color: #fff;
    font-size: 14px;
    font-weight: 800;
}

.kb-category-card h3 {
    margin: 0 0 10px;
    font-size: 20px;
    font-weight: 800;
    color: #355e98;
    line-height: 1.4;
}

.kb-category-card p {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.8;
}

.kb-popular-card {
    margin-top: 10px;
    border-radius: 24px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
}

.kb-popular-header {
    padding: 24px 28px;
    border-bottom: 1px solid #edf0f5;
    background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
}

.kb-popular-title {
    display: flex;
    align-items: center;
    gap: 12px;
}

.kb-popular-title i {
    color: #f59e0b;
    font-size: 22px;
}

.kb-popular-title h2 {
    margin: 0;
    font-size: 24px;
    font-weight: 800;
    color: #1f2937;
}

.kb-article-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 22px 26px;
    border-bottom: 1px solid #edf0f5;
    text-decoration: none !important;
    transition: 0.25s ease;
}

.kb-article-item:last-child {
    border-bottom: 0;
}

.kb-article-item:hover {
    background: #fafcff;
}

.kb-article-icon {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: rgba(53, 94, 152, 0.10);
    color: #355e98;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 18px;
}

.kb-article-content {
    flex: 1;
    min-width: 0;
}

.kb-article-content h3 {
    margin: 0 0 6px;
    font-size: 18px;
    font-weight: 700;
    color: #355e98;
    line-height: 1.5;
}

.kb-article-content p {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.8;
}

.kb-article-arrow {
    color: #c43135;
    align-self: center;
    font-size: 14px;
    opacity: 0.85;
}

.kb-empty-state {
    color: #6b7280;
    font-size: 14px;
    padding: 12px;
}

.kb-empty-big {
    padding: 24px 26px;
}

@media (max-width: 767px) {
    .kb-hero {
        padding: 24px 18px;
    }

    .kb-hero-text h1 {
        font-size: 28px;
    }

    .kb-search-box {
        flex-direction: column;
        align-items: stretch;
    }

    .kb-search-box i {
        top: 21px;
        left: 16px;
    }

    .kb-search-box input {
        min-height: 58px;
        padding-left: 46px;
    }

    .kb-search-box button {
        width: 100%;
        min-height: 54px;
    }

    .kb-article-item {
        padding: 18px;
    }
}
/* Knowledgebase page width fix */
.kb-modern {
    max-width: 100%;
    width: 100%;
}

.kb-modern .kb-hero,
.kb-modern .kb-section-head,
.kb-modern .kb-categories-grid,
.kb-modern .kb-popular-card {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.kb-modern .kb-hero {
    margin-bottom: 28px;
}

.kb-modern .kb-categories-grid {
    display: flex;
    flex-wrap: wrap;
}

.kb-modern .kb-categories-grid > [class*="col-"] {
    display: flex;
}

.kb-modern .kb-category-card {
    width: 100%;
}

.kb-modern .kb-popular-card {
    margin-top: 6px;
}

/* Make cards cleaner inside WHMCS content area */
.kb-category-card {
    min-height: 155px;
}

.kb-hero {
    padding: 34px 30px;
}

/* Reduce empty space on large screens */
@media (min-width: 1200px) {
    .kb-modern .kb-hero,
    .kb-modern .kb-section-head,
    .kb-modern .kb-categories-grid,
    .kb-modern .kb-popular-card {
        max-width: 980px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .kb-modern .kb-hero,
    .kb-modern .kb-section-head,
    .kb-modern .kb-categories-grid,
    .kb-modern .kb-popular-card {
        max-width: 100%;
    }
}
/* تعديل تصميم sidebarال  */
/* ================================
   Modern Sidebar Design - WHMCS
================================ */

/* Sidebar cards */
.sidebar .card,
.primary-sidebar .card,
.secondary-sidebar .card {
    border: 0 !important;
    border-radius: 18px !important;
    overflow: hidden;
    background: #ffffff !important;
    box-shadow: 0 14px 35px rgba(15, 23, 42, 0.08) !important;
    margin-bottom: 22px !important;
}

/* Sidebar headers */
.sidebar .card-header,
.primary-sidebar .card-header,
.secondary-sidebar .card-header {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%) !important;
    border-bottom: 1px solid #edf0f5 !important;
    padding: 18px 20px !important;
    color: #1f2937 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}

/* Header title/icon alignment */
.sidebar .card-header i,
.primary-sidebar .card-header i,
.secondary-sidebar .card-header i {
    color: #c43135 !important;
    margin-right: 8px !important;
}

/* Collapse arrow */
.sidebar .card-header .fa-chevron-up,
.sidebar .card-header .fa-chevron-down,
.primary-sidebar .card-header .fa-chevron-up,
.primary-sidebar .card-header .fa-chevron-down,
.secondary-sidebar .card-header .fa-chevron-up,
.secondary-sidebar .card-header .fa-chevron-down {
    color: #1f2937 !important;
    font-size: 14px !important;
    opacity: 0.85;
}

/* Sidebar body */
.sidebar .card-body,
.primary-sidebar .card-body,
.secondary-sidebar .card-body {
    padding: 10px !important;
}

/* List items */
.sidebar .list-group-item,
.primary-sidebar .list-group-item,
.secondary-sidebar .list-group-item {
    border: 0 !important;
    border-radius: 12px !important;
    margin-bottom: 8px !important;
    padding: 13px 15px !important;
    background: #f8fafc !important;
    color: #334155 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    transition: all 0.25s ease !important;
}

/* Links inside list */
.sidebar .list-group-item a,
.primary-sidebar .list-group-item a,
.secondary-sidebar .list-group-item a {
    color: #334155 !important;
    text-decoration: none !important;
}

/* Hover */
.sidebar .list-group-item:hover,
.primary-sidebar .list-group-item:hover,
.secondary-sidebar .list-group-item:hover {
    background: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08) !important;
}

/* Active item */
.sidebar .list-group-item.active,
.primary-sidebar .list-group-item.active,
.secondary-sidebar .list-group-item.active {
    background: linear-gradient(135deg, #c43135, #9f2327) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 24px rgba(196, 49, 53, 0.25) !important;
}

/* Active item links */
.sidebar .list-group-item.active a,
.primary-sidebar .list-group-item.active a,
.secondary-sidebar .list-group-item.active a {
    color: #ffffff !important;
}

/* Numbers badges like 4 / 1 */
.sidebar .badge,
.primary-sidebar .badge,
.secondary-sidebar .badge,
.sidebar .label,
.primary-sidebar .label,
.secondary-sidebar .label {
    background: rgba(196, 49, 53, 0.10) !important;
    color: #c43135 !important;
    border-radius: 999px !important;
    padding: 6px 10px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

/* Badge inside active item */
.sidebar .list-group-item.active .badge,
.primary-sidebar .list-group-item.active .badge,
.secondary-sidebar .list-group-item.active .badge,
.sidebar .list-group-item.active .label,
.primary-sidebar .list-group-item.active .label,
.secondary-sidebar .list-group-item.active .label {
    background: rgba(255, 255, 255, 0.18) !important;
    color: #ffffff !important;
}

/* Tag cloud links */
.sidebar .tagcloud a,
.primary-sidebar .tagcloud a,
.secondary-sidebar .tagcloud a,
.sidebar .tag-cloud a,
.primary-sidebar .tag-cloud a,
.secondary-sidebar .tag-cloud a,
.sidebar .card-body a,
.primary-sidebar .card-body a,
.secondary-sidebar .card-body a {
    display: inline-flex;
    align-items: center;
    margin: 5px 4px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #f3f6fa;
    color: #355e98 !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

/* Tag hover */
.sidebar .tagcloud a:hover,
.primary-sidebar .tagcloud a:hover,
.secondary-sidebar .tagcloud a:hover,
.sidebar .tag-cloud a:hover,
.primary-sidebar .tag-cloud a:hover,
.secondary-sidebar .tag-cloud a:hover,
.sidebar .card-body a:hover,
.primary-sidebar .card-body a:hover,
.secondary-sidebar .card-body a:hover {
    background: #c43135;
    color: #ffffff !important;
    transform: translateY(-2px);
}

/* Prevent sidebar menu links from becoming tag style */
.sidebar .list-group-item a,
.primary-sidebar .list-group-item a,
.secondary-sidebar .list-group-item a {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
}

/* Mobile spacing */
@media (max-width: 767px) {
    .sidebar .card,
    .primary-sidebar .card,
    .secondary-sidebar .card {
        border-radius: 16px !important;
    }

    .sidebar .card-header,
    .primary-sidebar .card-header,
    .secondary-sidebar .card-header {
        padding: 16px !important;
        font-size: 16px !important;
    }
}
/* knowledgebase  نهاية قسم ال  */

/* Announcements  بداية  قسم ال  */

/* =========================
   Announcements Modern UI
========================= */

.ann-modern-wrap {
    padding: 10px 0 40px;
}

.ann-modern-head {
    margin-bottom: 28px;
    padding: 34px 30px;
    border-radius: 24px;
    background:
        radial-gradient(circle at top left, rgba(196, 49, 53, 0.12), transparent 32%),
        linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08);
    text-align: right;
}

.ann-modern-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 15px;
    border-radius: 999px;
    background: rgba(196, 49, 53, 0.10);
    color: #c43135;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 12px;
}

.ann-modern-head h1 {
    margin: 0 0 10px;
    font-size: 38px;
    font-weight: 800;
    color: #1f2937;
}

.ann-modern-head p {
    margin: 0;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.9;
}

.ann-modern-list {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

.ann-modern-card {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid #edf0f5;
    border-radius: 24px;
    padding: 28px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.07);
    transition: all 0.25s ease;
}

.ann-modern-card:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 5px;
    height: 100%;
    background: linear-gradient(180deg, #c43135, #7f1d1d);
}

.ann-modern-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 52px rgba(15, 23, 42, 0.11);
    border-color: rgba(196, 49, 53, 0.18);
}

.ann-modern-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.ann-modern-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(31, 163, 196, 0.12);
    color: #1fa3c4;
    font-size: 13px;
    font-weight: 800;
}

.ann-modern-date {
    color: #6b7280;
    font-size: 15px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.ann-modern-date i {
    color: #c43135;
}

.ann-modern-title {
    margin: 0 0 16px;
    font-size: 25px;
    line-height: 1.7;
    font-weight: 800;
}

.ann-modern-title a {
    color: #17324d;
    text-decoration: none !important;
    transition: 0.25s ease;
}

.ann-modern-title a:hover {
    color: #c43135;
}

.ann-modern-edit-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-right: 10px;
    padding: 7px 10px;
    border-radius: 10px;
    background: #f3f4f6;
    color: #374151 !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    vertical-align: middle;
}

.ann-modern-edit-btn:hover {
    background: #c43135;
    color: #fff !important;
}

.ann-modern-excerpt {
    margin-bottom: 20px;
    padding: 18px 20px;
    background: #f8fafc;
    border-radius: 16px;
    border-right: 4px solid #c43135;
    color: #4b5563;
    font-size: 15px;
    line-height: 2;
}

.ann-modern-excerpt p:last-child {
    margin-bottom: 0;
}

.ann-modern-footer {
    display: flex;
    justify-content: flex-start;
}

.ann-modern-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    border-radius: 14px;
    background: #fff;
    border: 1px solid #d8dee8;
    color: #1f2937 !important;
    text-decoration: none !important;
    font-size: 15px;
    font-weight: 800;
    transition: all 0.25s ease;
}

.ann-modern-btn:hover {
    background: #c43135;
    border-color: #c43135;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(196, 49, 53, 0.22);
}

.ann-modern-pagination {
    margin-top: 24px;
}

.ann-modern-pagination .pagination {
    justify-content: center;
    gap: 8px;
}

.ann-modern-pagination .page-link {
    border: 0 !important;
    border-radius: 12px !important;
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff !important;
    color: #355e98 !important;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
    font-weight: 700;
}

.ann-modern-pagination .page-item.active .page-link {
    background: #c43135 !important;
    color: #fff !important;
    box-shadow: 0 12px 24px rgba(196, 49, 53, 0.24);
}

.ann-modern-empty {
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
}

@media (max-width: 767px) {
    .ann-modern-head {
        padding: 24px 18px;
    }

    .ann-modern-head h1 {
        font-size: 28px;
    }

    .ann-modern-card {
        padding: 20px;
    }

    .ann-modern-title {
        font-size: 20px;
    }

    .ann-modern-meta {
        align-items: flex-start;
        flex-direction: column;
    }
}
/* ================================
   Modern Submit Ticket Page
================================ */

.ticket-modern-page {
    padding: 12px 0 45px;
}

.ticket-modern-hero {
    margin-bottom: 28px;
    padding: 36px 32px;
    border-radius: 28px;
    background:
        radial-gradient(circle at top left, rgba(196, 49, 53, 0.13), transparent 34%),
        linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
    text-align: center;
}

.ticket-modern-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    margin-bottom: 13px;
    border-radius: 999px;
    background: rgba(196, 49, 53, 0.11);
    color: #c43135;
    font-size: 13px;
    font-weight: 800;
}

.ticket-modern-hero h1 {
    margin: 0 0 10px;
    color: #1f2937;
    font-size: 38px;
    font-weight: 800;
}

.ticket-modern-hero p {
    margin: 0;
    color: #6b7280;
    font-size: 16px;
    line-height: 1.9;
}

.ticket-modern-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 26px;
    align-items: start;
}

.ticket-modern-card {
    overflow: hidden;
    border-radius: 28px;
    background: #fff;
    border: 1px solid #edf0f5;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
}

.ticket-modern-card-header {
    padding: 30px 34px;
    border-bottom: 1px solid #edf0f5;
    background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%);
}

.ticket-modern-card-header h3 {
    margin: 0 0 8px;
    color: #1f2937;
    font-size: 28px;
    font-weight: 800;
}

.ticket-modern-card-header p {
    margin: 0;
    color: #6b7280;
    font-size: 15px;
    line-height: 1.8;
}

.ticket-modern-card-body {
    padding: 34px;
}

.ticket-modern-section {
    margin-bottom: 30px;
    padding-bottom: 26px;
    border-bottom: 1px solid #edf0f5;
}

.ticket-modern-section:last-of-type {
    border-bottom: 0;
}

.ticket-modern-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: #1f2937;
    font-size: 18px;
    font-weight: 800;
}

.ticket-modern-section-title i {
    width: 38px;
    height: 38px;
    border-radius: 13px;
    background: rgba(196, 49, 53, 0.10);
    color: #c43135;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ticket-modern-card label {
    display: block;
    margin-bottom: 9px;
    color: #263238;
    font-size: 14px;
    font-weight: 800;
}

.ticket-modern-card .form-group {
    margin-bottom: 20px;
}

.ticket-modern-card .form-control,
.ticket-modern-card input[type="text"],
.ticket-modern-card input[type="email"],
.ticket-modern-card select,
.ticket-modern-card textarea {
    width: 100%;
    min-height: 54px;
    border: 1px solid #d9dee7 !important;
    border-radius: 15px !important;
    background: #f8fafc !important;
    color: #1f2937 !important;
    padding: 14px 16px !important;
    font-size: 15px;
    box-shadow: none !important;
    transition: 0.25s ease;
}

.ticket-modern-card .form-control:focus,
.ticket-modern-card input:focus,
.ticket-modern-card select:focus,
.ticket-modern-card textarea:focus {
    background: #fff !important;
    border-color: #c43135 !important;
    box-shadow: 0 0 0 4px rgba(196, 49, 53, 0.12) !important;
    outline: none !important;
}

.ticket-modern-card .form-control.disabled,
.ticket-modern-card input:disabled {
    background: #eef2f7 !important;
    cursor: not-allowed;
    color: #6b7280 !important;
}

.ticket-modern-card textarea {
    min-height: 200px;
    resize: vertical;
}

/* Markdown editor */
.ticket-modern-card .editor-toolbar {
    border: 1px solid #d9dee7 !important;
    border-bottom: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    background: #fff !important;
    padding: 8px !important;
}

.ticket-modern-card .editor-toolbar a {
    border: 0 !important;
    border-radius: 10px !important;
    color: #4b5563 !important;
}

.ticket-modern-card .editor-toolbar a:hover,
.ticket-modern-card .editor-toolbar a.active {
    background: rgba(196, 49, 53, 0.10) !important;
    color: #c43135 !important;
}

.ticket-modern-card .CodeMirror {
    border: 1px solid #d9dee7 !important;
    border-radius: 0 0 16px 16px !important;
    background: #fcfcfd !important;
    min-height: 300px;
}

.ticket-modern-card .editor-statusbar {
    color: #6b7280 !important;
    font-size: 13px;
}

/* Attachments */
.ticket-modern-card .input-group {
    border-radius: 15px;
}

.ticket-modern-card .custom-file-label {
    min-height: 54px;
    padding: 14px 16px !important;
    border: 1px solid #d9dee7 !important;
    border-radius: 15px 0 0 15px !important;
    background: #f8fafc !important;
    color: #4b5563 !important;
}

.ticket-modern-card .custom-file-label::after {
    height: 52px !important;
    padding: 14px 20px !important;
    border: 0 !important;
    background: #eef2f7 !important;
    color: #1f2937 !important;
    font-weight: 800;
}

.ticket-modern-help {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 12px;
    color: #6b7280;
}

.ticket-modern-help i {
    color: #c43135;
    margin-top: 3px;
}

.ticket-modern-help small {
    font-size: 13px;
    line-height: 1.8;
}

.ticket-modern-captcha {
    margin: 24px 0;
    text-align: center;
}

.ticket-modern-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.ticket-modern-submit,
.ticket-modern-cancel,
.ticket-modern-card .btn {
    border-radius: 14px !important;
    padding: 13px 24px !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    transition: 0.25s ease;
}

.ticket-modern-submit {
    background: #c43135 !important;
    border-color: #c43135 !important;
    color: #fff !important;
    box-shadow: 0 16px 35px rgba(196, 49, 53, 0.22);
}

.ticket-modern-submit:hover {
    background: #a7282c !important;
    border-color: #a7282c !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 20px 42px rgba(196, 49, 53, 0.28);
}

.ticket-modern-cancel,
.ticket-modern-card .btn-default {
    background: #fff !important;
    border: 1px solid #d8dee8 !important;
    color: #1f2937 !important;
}

.ticket-modern-cancel:hover,
.ticket-modern-card .btn-default:hover {
    background: #f8fafc !important;
    transform: translateY(-2px);
}

/* Side cards */
.ticket-modern-side {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ticket-help-card {
    border-radius: 24px;
    padding: 26px;
    background: #fff;
    border: 1px solid #edf0f5;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08);
}

.ticket-help-icon {
    width: 58px;
    height: 58px;
    margin-bottom: 16px;
    border-radius: 18px;
    background: rgba(196, 49, 53, 0.10);
    color: #c43135;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.ticket-help-card h3 {
    margin: 0 0 14px;
    color: #1f2937;
    font-size: 21px;
    font-weight: 800;
}

.ticket-help-card ul {
    margin: 0;
    padding-right: 18px;
    color: #4b5563;
    line-height: 2;
    font-size: 14px;
}

.ticket-help-card li {
    margin-bottom: 8px;
}

.ticket-help-card-dark {
    background: linear-gradient(160deg, #132938, #0b1822);
    color: #fff;
}

.ticket-help-card-dark h3 {
    color: #fff;
}

.ticket-help-card-dark p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.9;
}

/* Responsive */
@media (max-width: 1199px) {
    .ticket-modern-layout {
        grid-template-columns: 1fr;
    }

    .ticket-modern-side {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 767px) {
    .ticket-modern-hero {
        padding: 24px 18px;
    }

    .ticket-modern-hero h1 {
        font-size: 28px;
    }

    .ticket-modern-card-header,
    .ticket-modern-card-body {
        padding: 22px;
    }

    .ticket-modern-side {
        grid-template-columns: 1fr;
    }

    .ticket-modern-actions {
        flex-direction: column;
    }

    .ticket-modern-actions .btn {
        width: 100%;
    }
}
/* ================================
   Modern Domain Transfer Page
================================ */

.domain-transfer,
#order-standard_cart {
    --brand-red: #c43135;
    --brand-red-dark: #a7282c;
    --brand-navy: #132938;
    --brand-text: #1f2937;
    --brand-muted: #6b7280;
    --brand-border: #edf0f5;
    --brand-bg: #f8fafc;
}

/* ================================
   Modern Header / Hero
================================ */

/* إخفاء الخط القديم تحت العنوان */
#order-standard_cart h1:after,
.domain-transfer h1:after {
    display: none !important;
}

/* صندوق الهيدر */
#order-standard_cart .text-center {
    position: relative;
    overflow: hidden;
    margin-bottom: 36px !important;
    padding: 44px 32px 40px !important;
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(196, 49, 53, 0.13), transparent 30%),
        radial-gradient(circle at bottom left, rgba(19, 41, 56, 0.07), transparent 34%),
        linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    box-shadow: 0 22px 58px rgba(15, 23, 42, 0.09);
    border: 1px solid rgba(237, 240, 245, 0.9);
}

/* دوائر زخرفية */
#order-standard_cart .text-center:before {
    content: "";
    position: absolute;
    top: -75px;
    right: -75px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: rgba(196, 49, 53, 0.08);
}

#order-standard_cart .text-center:after {
    content: "";
    position: absolute;
    bottom: -95px;
    left: -85px;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: rgba(19, 41, 56, 0.06);
}

/* العنوان الصغير Transfer Domain */
#order-standard_cart h1,
.domain-transfer h1 {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px !important;
    padding: 9px 22px !important;
    border-radius: 999px;
    background: rgba(196, 49, 53, 0.11);
    color: var(--brand-red) !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    line-height: 1.4;
}

/* العنوان الكبير Transfer your domain to us */
#order-standard_cart .text-center h2,
#order-standard_cart h2 {
    position: relative;
    z-index: 2;
    margin: 0 0 13px !important;
    color: var(--brand-text) !important;
    font-size: 48px !important;
    font-weight: 800 !important;
    line-height: 1.22;
    letter-spacing: -0.9px;
}

/* الوصف */
#order-standard_cart .text-center p {
    position: relative;
    z-index: 2;
    max-width: 720px;
    margin: 0 auto !important;
    color: var(--brand-muted) !important;
    font-size: 18px !important;
    line-height: 1.8;
}

/* ================================
   Transfer Box / Card
================================ */

#order-standard_cart .domain-transfer-container,
#order-standard_cart .panel,
#order-standard_cart .card {
    border: 0 !important;
    border-radius: 26px !important;
    overflow: hidden;
    background: #ffffff !important;
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.10) !important;
}

/* Card header */
#order-standard_cart .panel-heading,
#order-standard_cart .card-header {
    padding: 25px 30px !important;
    background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%) !important;
    border-bottom: 1px solid var(--brand-border) !important;
}

#order-standard_cart .panel-heading h3,
#order-standard_cart .card-header h3,
#order-standard_cart .card-title {
    margin: 0 !important;
    color: var(--brand-text) !important;
    font-size: 30px !important;
    font-weight: 800 !important;
    line-height: 1.4;
}

/* Card body */
#order-standard_cart .panel-body,
#order-standard_cart .card-body {
    padding: 32px 30px !important;
}

/* Card footer */
#order-standard_cart .panel-footer,
#order-standard_cart .card-footer {
    padding: 24px 30px !important;
    background: #fafafa !important;
    border-top: 1px solid var(--brand-border) !important;
}

/* ================================
   Form Fields
================================ */

#order-standard_cart label {
    display: block;
    color: #374151 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    margin-bottom: 9px !important;
}

#order-standard_cart .form-control,
#order-standard_cart input[type="text"],
#order-standard_cart input[type="email"],
#order-standard_cart select {
    min-height: 56px !important;
    border: 1px solid #d9dee7 !important;
    border-radius: 15px !important;
    background: var(--brand-bg) !important;
    color: var(--brand-text) !important;
    padding: 14px 16px !important;
    font-size: 16px !important;
    box-shadow: none !important;
    transition: all 0.25s ease;
}

#order-standard_cart .form-control:focus,
#order-standard_cart input:focus,
#order-standard_cart select:focus {
    background: #fff !important;
    border-color: var(--brand-red) !important;
    box-shadow: 0 0 0 4px rgba(196, 49, 53, 0.13) !important;
    outline: none !important;
}

/* Placeholder */
#order-standard_cart .form-control::placeholder,
#order-standard_cart input::placeholder {
    color: #8b95a1 !important;
}

/* Help link */
#order-standard_cart a {
    color: #355e98;
    text-decoration: none;
}

#order-standard_cart a:hover {
    color: var(--brand-red);
}

/* Help icon */
#order-standard_cart .fa-question-circle,
#order-standard_cart .fas.fa-question-circle {
    color: #355e98 !important;
}

/* ================================
   Buttons
================================ */

#order-standard_cart .btn-primary,
#order-standard_cart .btn-success,
#order-standard_cart button[type="submit"] {
    border: 0 !important;
    border-radius: 14px !important;
    background: var(--brand-red) !important;
    color: #fff !important;
    padding: 14px 30px !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    box-shadow: 0 16px 36px rgba(196, 49, 53, 0.26) !important;
    transition: all 0.25s ease;
}

#order-standard_cart .btn-primary:hover,
#order-standard_cart .btn-success:hover,
#order-standard_cart button[type="submit"]:hover {
    background: var(--brand-red-dark) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 22px 46px rgba(196, 49, 53, 0.33) !important;
}

/* ================================
   Note Text
================================ */

#order-standard_cart .domain-transfer-note,
#order-standard_cart small,
#order-standard_cart .text-muted {
    color: var(--brand-muted) !important;
    font-size: 14px;
    line-height: 1.7;
}

/* ================================
   Sidebar Active Item
================================ */

.sidebar .list-group-item.active,
.primary-sidebar .list-group-item.active,
.secondary-sidebar .list-group-item.active {
    background: linear-gradient(135deg, #c43135, #9f2327) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(196, 49, 53, 0.22) !important;
}

.sidebar .list-group-item.active a,
.primary-sidebar .list-group-item.active a,
.secondary-sidebar .list-group-item.active a {
    color: #fff !important;
}

/* ================================
   Mobile Responsive
================================ */

@media (max-width: 767px) {
    #order-standard_cart .text-center {
        padding: 28px 18px !important;
        border-radius: 22px;
        margin-bottom: 26px !important;
    }

    #order-standard_cart h1,
    .domain-transfer h1 {
        font-size: 13px !important;
        padding: 8px 15px !important;
        margin-bottom: 14px !important;
    }

    #order-standard_cart .text-center h2,
    #order-standard_cart h2 {
        font-size: 30px !important;
        line-height: 1.35;
    }

    #order-standard_cart .text-center p {
        font-size: 15px !important;
    }

    #order-standard_cart .panel-body,
    #order-standard_cart .card-body,
    #order-standard_cart .panel-footer,
    #order-standard_cart .card-footer {
        padding: 22px !important;
    }

    #order-standard_cart .panel-heading,
    #order-standard_cart .card-header {
        padding: 22px !important;
    }

    #order-standard_cart .panel-heading h3,
    #order-standard_cart .card-header h3,
    #order-standard_cart .card-title {
        font-size: 24px !important;
    }

    #order-standard_cart .btn-primary,
    #order-standard_cart .btn-success,
    #order-standard_cart button[type="submit"] {
        width: 100%;
    }
}
/* ================================
   Fix Review & Checkout Cart Page
================================ */

/* إلغاء تأثير الهيرو من صفحة السلة */
#order-standard_cart .view-cart-items-header,
#order-standard_cart .empty-cart,
#order-standard_cart .order-summary,
#order-standard_cart .summary-container,
#order-standard_cart .checkout-security-msg {
    position: static !important;
}

/* إصلاح Order Summary */
#order-standard_cart .order-summary {
    background: #ffffff !important;
    border: 1px solid #edf0f5 !important;
    border-radius: 24px !important;
    overflow: hidden;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08) !important;
}

#order-standard_cart .order-summary h2 {
    margin: 0 !important;
    padding: 28px 26px !important;
    background: linear-gradient(135deg, #132938, #0b1822) !important;
    color: #ffffff !important;
    font-size: 30px !important;
    font-weight: 800 !important;
    line-height: 1.3;
    text-align: center;
}

/* إصلاح محتوى الملخص */
#order-standard_cart .summary-container {
    padding: 22px 24px !important;
    background: #ffffff !important;
}

#order-standard_cart .summary-container .subtotal,
#order-standard_cart .summary-container .total-due-today,
#order-standard_cart .summary-container .recurring-totals {
    color: #1f2937 !important;
}

/* إجمالي السعر */
#order-standard_cart .total-due-today .amt,
#order-standard_cart .total-due-today span {
    color: #132938 !important;
}

/* زر Checkout */
#order-standard_cart .btn-checkout,
#order-standard_cart a.btn-checkout,
#order-standard_cart button.btn-checkout {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0 !important;
    border-radius: 16px !important;
    background: #c43135 !important;
    color: #ffffff !important;
    padding: 15px 30px !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    box-shadow: 0 16px 36px rgba(196, 49, 53, 0.26) !important;
    transition: all 0.25s ease;
}

#order-standard_cart .btn-checkout:hover {
    background: #a7282c !important;
    color: #ffffff !important;
    transform: translateY(-2px);
}

/* إصلاح جدول المنتجات */
#order-standard_cart .view-cart-items {
    border-radius: 22px !important;
    overflow: hidden;
    background: #ffffff !important;
    border: 1px solid #edf0f5 !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.06) !important;
}

#order-standard_cart .view-cart-items-header {
    background: #c43135 !important;
    color: #ffffff !important;
    border-radius: 0 !important;
}

#order-standard_cart .view-cart-items-header .item-title,
#order-standard_cart .view-cart-items-header .item-price {
    color: #ffffff !important;
    font-weight: 800 !important;
}

/* إصلاح النص داخل السلة الفارغة */
#order-standard_cart .empty-cart {
    padding: 36px 20px !important;
    text-align: center !important;
    color: #1f2937 !important;
    background: #ffffff !important;
}

/* إصلاح تبويبات الكوبون والضريبة */
#order-standard_cart .view-cart-tabs .nav-tabs {
    border-bottom: 1px solid #edf0f5 !important;
}

#order-standard_cart .view-cart-tabs .nav-tabs > li > a,
#order-standard_cart .view-cart-tabs .nav-tabs .nav-link {
    border-radius: 12px 12px 0 0 !important;
    color: #355e98 !important;
    font-weight: 700;
}

#order-standard_cart .view-cart-tabs .nav-tabs > li.active > a,
#order-standard_cart .view-cart-tabs .nav-tabs .nav-link.active {
    background: #ffffff !important;
    color: #c43135 !important;
    border-color: #edf0f5 #edf0f5 #ffffff !important;
}

/* إصلاح حقل الكوبون */
#order-standard_cart #inputPromotionCode,
#order-standard_cart input[name="promocode"] {
    min-height: 56px !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    border: 1px solid #d9dee7 !important;
    color: #1f2937 !important;
}

/* زر Validate Code */
#order-standard_cart #btnValidatePromoCode,
#order-standard_cart button[name="validatepromo"] {
    width: 100%;
    border-radius: 16px !important;
    background: #c43135 !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    padding: 14px 24px !important;
    border: 0 !important;
    box-shadow: 0 16px 36px rgba(196, 49, 53, 0.22) !important;
}

/* Continue Shopping */
#order-standard_cart .continue-shopping {
    color: #132938 !important;
    font-weight: 700;
    text-decoration: none !important;
}

#order-standard_cart .continue-shopping:hover {
    color: #c43135 !important;
}
/* =====================================
   Horanos Modern Domain Pricing Page
===================================== */

.domain-pricing-modern {
    --hp-red: #c43135;
    --hp-red-dark: #a7282c;
    --hp-navy: #132938;
    --hp-text: #1f2937;
    --hp-muted: #6b7280;
    --hp-border: #e7ebf1;
    --hp-soft: #f8fafc;
    --hp-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);

    padding: 18px 0 50px;
}

/* Hero */
.domain-pricing-modern .dp-hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 34px;
    padding: 38px 32px;
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(196, 49, 53, 0.13), transparent 30%),
        radial-gradient(circle at bottom left, rgba(19, 41, 56, 0.07), transparent 34%),
        linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
    box-shadow: 0 22px 58px rgba(15, 23, 42, 0.09);
    text-align: center;
}

.domain-pricing-modern .dp-badge,
.domain-pricing-modern .dp-section-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    margin-bottom: 12px;
    border-radius: 999px;
    background: rgba(196, 49, 53, 0.11);
    color: var(--hp-red);
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.domain-pricing-modern .dp-hero h1 {
    margin: 0 0 10px;
    color: var(--hp-text);
    font-size: 42px;
    font-weight: 900;
    line-height: 1.25;
}

.domain-pricing-modern .dp-hero p {
    max-width: 720px;
    margin: 0 auto;
    color: var(--hp-muted);
    font-size: 17px;
    line-height: 1.8;
}

/* Featured TLD cards */
.domain-pricing-modern .dp-featured {
    margin-bottom: 36px;
}

.domain-pricing-modern .dp-tld-card {
    height: 100%;
    border: 1px solid var(--hp-border) !important;
    border-radius: 24px !important;
    overflow: hidden;
    background: #fff !important;
    box-shadow: var(--hp-shadow) !important;
    transition: all 0.25s ease;
}

.domain-pricing-modern .dp-tld-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 26px 58px rgba(15, 23, 42, 0.14) !important;
}

.domain-pricing-modern .dp-tld-card .img-container {
    min-height: 145px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: #fff;
}

.domain-pricing-modern .dp-tld-card img {
    max-width: 82%;
    max-height: 105px;
    object-fit: contain;
}

.domain-pricing-modern .dp-tld-card .price {
    padding: 16px 18px !important;
    text-align: center;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border-top: 1px solid var(--hp-border);
    color: var(--hp-text) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
}

/* Special existing TLD colors */
.domain-pricing-modern .dp-tld-card .price.com {
    background: #34a8d9 !important;
    color: #fff !important;
}

.domain-pricing-modern .dp-tld-card .price.net {
    background: #f0c400 !important;
    color: #fff !important;
}

/* Main panel */
.domain-pricing-modern .dp-pricing-panel {
    padding: 30px;
    border-radius: 28px;
    background: #fff;
    border: 1px solid var(--hp-border);
    box-shadow: var(--hp-shadow);
}

.domain-pricing-modern .dp-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}

.domain-pricing-modern .dp-section-header h2 {
    margin: 0 0 8px;
    color: var(--hp-text);
    font-size: 30px;
    font-weight: 900;
    line-height: 1.35;
}

.domain-pricing-modern .dp-section-header p {
    margin: 0;
    color: var(--hp-muted);
    font-size: 15px;
    line-height: 1.8;
}

.domain-pricing-modern .dp-currency-form {
    min-width: 230px;
}

.domain-pricing-modern .currency-selector {
    min-height: 48px;
    border: 1px solid #d9dee7 !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
    color: var(--hp-text) !important;
    font-weight: 700;
}

/* Filters */
.domain-pricing-modern .dp-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 18px 0 28px;
}

.domain-pricing-modern .dp-filters a {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    padding: 10px 15px !important;
    border-radius: 999px !important;
    background: #eef2f7 !important;
    color: #355e98 !important;
    border: 1px solid transparent !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

.domain-pricing-modern .dp-filters a span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 25px;
    height: 25px;
    border-radius: 999px;
    background: #fff;
    color: var(--hp-red);
    font-size: 12px;
    font-weight: 900;
}

.domain-pricing-modern .dp-filters a:hover,
.domain-pricing-modern .dp-filters a.badge-success {
    background: var(--hp-red) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(196, 49, 53, 0.22);
}

.domain-pricing-modern .dp-filters a:hover span,
.domain-pricing-modern .dp-filters a.badge-success span {
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
}

/* DataTables controls */
.domain-pricing-modern .dataTables_length,
.domain-pricing-modern .dataTables_filter,
.domain-pricing-modern .dataTables_info {
    color: var(--hp-text) !important;
    font-size: 15px;
    font-weight: 700;
}

.domain-pricing-modern .dataTables_filter,
.domain-pricing-modern .dataTables_length {
    margin-bottom: 18px;
}

.domain-pricing-modern .dataTables_filter label,
.domain-pricing-modern .dataTables_length label {
    color: var(--hp-muted) !important;
    font-weight: 800;
}

.domain-pricing-modern .dataTables_filter input,
.domain-pricing-modern .dataTables_length select {
    min-height: 48px !important;
    border: 1px solid #d9dee7 !important;
    border-radius: 14px !important;
    background: #fff !important;
    color: var(--hp-text) !important;
    padding: 10px 14px !important;
    box-shadow: none !important;
    outline: none !important;
    transition: 0.25s ease;
}

.domain-pricing-modern .dataTables_filter input:focus,
.domain-pricing-modern .dataTables_length select:focus {
    border-color: var(--hp-red) !important;
    box-shadow: 0 0 0 4px rgba(196, 49, 53, 0.12) !important;
}

/* Table */
.domain-pricing-modern .dp-table-wrap {
    border-radius: 24px;
    border: 1px solid var(--hp-border);
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
    overflow: hidden;
}

.domain-pricing-modern table,
.domain-pricing-modern table.dataTable {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #fff;
}

.domain-pricing-modern table thead th,
.domain-pricing-modern table.dataTable thead th {
    background: linear-gradient(135deg, var(--hp-navy), #0b1822) !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    padding: 18px 16px !important;
    border: 0 !important;
    text-align: center !important;
    white-space: nowrap;
}

.domain-pricing-modern table tbody td,
.domain-pricing-modern table.dataTable tbody td {
    padding: 18px 16px !important;
    border-top: 1px solid var(--hp-border) !important;
    border-bottom: 0 !important;
    color: var(--hp-text) !important;
    font-size: 15px !important;
    vertical-align: middle !important;
    text-align: center !important;
    background: #fff !important;
}

.domain-pricing-modern table tbody tr:hover td,
.domain-pricing-modern table.dataTable tbody tr:hover td {
    background: #fbfcfe !important;
}

.domain-pricing-modern .dp-tld-name {
    text-align: left !important;
}

.domain-pricing-modern .dp-tld-name > span:first-child {
    color: var(--hp-navy);
    font-size: 19px;
    font-weight: 900;
}

.domain-pricing-modern .dp-category-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 12px;
    border-radius: 999px;
    background: #eef2f7;
    color: #355e98;
    font-size: 13px;
    font-weight: 800;
}

.domain-pricing-modern .dp-price-cell strong,
.domain-pricing-modern .dp-period-cell strong {
    display: block;
    color: #111827;
    font-size: 16px;
    font-weight: 900;
}

.domain-pricing-modern .dp-price-cell small,
.domain-pricing-modern .dp-period-cell small {
    display: block;
    margin-top: 4px;
    color: var(--hp-muted) !important;
    font-size: 13px;
    line-height: 1.6;
}

/* HOT badges */
.domain-pricing-modern .tld-sale-group,
.domain-pricing-modern .label-danger,
.domain-pricing-modern .badge-danger {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin-left: 7px;
    padding: 5px 8px !important;
    border-radius: 8px !important;
    background: #ef4444 !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase;
}

/* Pagination */
.domain-pricing-modern .dataTables_paginate,
.domain-pricing-modern .pagination {
    margin-top: 18px !important;
}

.domain-pricing-modern .dataTables_paginate .paginate_button,
.domain-pricing-modern .pagination .page-link {
    border: 0 !important;
    border-radius: 12px !important;
    min-width: 42px;
    min-height: 42px;
    margin: 0 4px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: #fff !important;
    color: #355e98 !important;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.06);
    font-weight: 900;
    transition: 0.25s ease;
}

.domain-pricing-modern .dataTables_paginate .paginate_button.current,
.domain-pricing-modern .dataTables_paginate .paginate_button.current:hover,
.domain-pricing-modern .pagination .page-item.active .page-link {
    background: var(--hp-red) !important;
    color: #fff !important;
    box-shadow: 0 12px 24px rgba(196, 49, 53, 0.24);
}

.domain-pricing-modern .dataTables_paginate .paginate_button:hover,
.domain-pricing-modern .pagination .page-link:hover {
    background: #f8fafc !important;
    color: var(--hp-red) !important;
}

.domain-pricing-modern .dataTables_info {
    padding-top: 18px;
    color: var(--hp-muted) !important;
}

/* Loading */
.domain-pricing-modern .dp-loading {
    padding: 30px;
    color: var(--hp-muted);
}

/* Responsive */
@media (max-width: 991px) {
    .domain-pricing-modern .dp-section-header {
        flex-direction: column;
    }

    .domain-pricing-modern .dp-currency-form {
        width: 100%;
    }

    .domain-pricing-modern .dp-hero h1 {
        font-size: 34px;
    }

    .domain-pricing-modern .dp-pricing-panel {
        padding: 22px;
    }
}

@media (max-width: 767px) {
    .domain-pricing-modern {
        padding-top: 8px;
    }

    .domain-pricing-modern .dp-hero {
        padding: 28px 18px;
        border-radius: 22px;
    }

    .domain-pricing-modern .dp-hero h1 {
        font-size: 28px;
    }

    .domain-pricing-modern .dp-hero p {
        font-size: 15px;
    }

    .domain-pricing-modern .dp-table-wrap {
        border-radius: 18px;
        overflow-x: auto;
    }

    .domain-pricing-modern table {
        min-width: 900px;
    }

    .domain-pricing-modern .dataTables_filter,
    .domain-pricing-modern .dataTables_length {
        float: none !important;
        width: 100%;
        text-align: left !important;
    }

    .domain-pricing-modern .dataTables_filter input {
        width: 100% !important;
        margin: 8px 0 0 !important;
    }

    .domain-pricing-modern .dataTables_length select {
        margin: 8px 6px !important;
    }
}
/* =========================================
   Clean Professional Register Domain Page
========================================= */

#order-standard_cart.domain-register-modern {
    --brand-red: #c43135;
    --brand-red-dark: #a7282c;
    --brand-navy: #132938;
    --brand-text: #1f2937;
    --brand-muted: #667085;
    --brand-border: #e5e7eb;
    --brand-soft: #f8fafc;
}

/* Reset old effects */
#order-standard_cart.domain-register-modern h1:after,
#order-standard_cart.domain-register-modern .header-lined h1:after {
    display: none !important;
}

/* Page title */
#order-standard_cart.domain-register-modern .header-lined {
    border: 0 !important;
    padding: 0 !important;
    margin: 0 0 18px !important;
}

#order-standard_cart.domain-register-modern .header-lined h1 {
    display: inline-flex !important;
    align-items: center;
    margin: 0 !important;
    padding: 9px 18px !important;
    border-radius: 12px !important;
    background: rgba(196, 49, 53, 0.08) !important;
    color: var(--brand-red) !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    box-shadow: none !important;
}

/* Intro text */
#order-standard_cart.domain-register-modern .cart-body > p {
    max-width: 900px;
    margin: 0 0 24px !important;
    color: var(--brand-text) !important;
    font-size: 18px;
    line-height: 1.7;
}

/* Main search section */
#order-standard_cart.domain-register-modern .domain-checker-container {
    margin-bottom: 34px !important;
    border-radius: 22px !important;
    background:
        linear-gradient(135deg, rgba(19, 41, 56, 0.96), rgba(33, 72, 86, 0.92)),
        linear-gradient(135deg, #132938, #e5e7eb) !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12) !important;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

#order-standard_cart.domain-register-modern .domain-checker-bg {
    background: transparent !important;
    padding: 54px 28px !important;
}

/* Search box */
#order-standard_cart.domain-register-modern .input-group-box {
    max-width: 720px;
    margin: 0 auto;
    padding: 8px;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 35px rgba(0, 0, 0, 0.18);
}

/* Search input */
#order-standard_cart.domain-register-modern #inputDomain {
    min-height: 58px !important;
    border: 1px solid #d9dee7 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    color: var(--brand-text) !important;
    font-size: 17px !important;
    padding: 14px 18px !important;
    box-shadow: none !important;
}

#order-standard_cart.domain-register-modern #inputDomain:focus {
    border-color: var(--brand-red) !important;
    box-shadow: 0 0 0 4px rgba(196, 49, 53, 0.12) !important;
}

#order-standard_cart.domain-register-modern #inputDomain::placeholder {
    color: #98a2b3 !important;
}

/* Search button */
#order-standard_cart.domain-register-modern #btnCheckAvailability {
    min-height: 58px !important;
    min-width: 128px;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--brand-red) !important;
    color: #ffffff !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    padding: 13px 24px !important;
    box-shadow: 0 10px 24px rgba(196, 49, 53, 0.24) !important;
    transition: 0.22s ease;
}

#order-standard_cart.domain-register-modern #btnCheckAvailability:hover {
    background: var(--brand-red-dark) !important;
    transform: translateY(-1px);
}

/* Promo cards */
#order-standard_cart.domain-register-modern .domain-promo-box {
    position: relative;
    min-height: 230px;
    margin-top: 28px;
    padding: 30px 28px !important;
    border: 1px solid var(--brand-border) !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.10) !important;
    text-align: left;
    overflow: hidden;
    transition: 0.22s ease;
}

#order-standard_cart.domain-register-modern .domain-promo-box:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 48px rgba(15, 23, 42, 0.14) !important;
}

/* Promo icons */
#order-standard_cart.domain-register-modern .domain-promo-box i {
    position: absolute;
    top: 26px;
    right: 26px;
    color: rgba(19, 41, 56, 0.18) !important;
    font-size: 62px !important;
}

/* Promo title */
#order-standard_cart.domain-register-modern .domain-promo-box h3 {
    max-width: 75%;
    margin: 0 0 8px !important;
    color: var(--brand-text) !important;
    font-size: 27px !important;
    font-weight: 800 !important;
    line-height: 1.3;
}

/* Promo text */
#order-standard_cart.domain-register-modern .domain-promo-box p {
    max-width: 85%;
    color: var(--brand-muted) !important;
    font-size: 15px;
    line-height: 1.7;
}

#order-standard_cart.domain-register-modern .domain-promo-box .text-warning {
    color: #d89400 !important;
    font-weight: 700;
}

#order-standard_cart.domain-register-modern .domain-promo-box .text-primary {
    color: #2f5f9f !important;
    font-weight: 700;
}

/* Promo buttons */
#order-standard_cart.domain-register-modern .domain-promo-box .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 210px;
    margin-top: 12px;
    border: 0 !important;
    border-radius: 12px !important;
    background: var(--brand-red) !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    padding: 13px 22px !important;
    box-shadow: 0 10px 24px rgba(196, 49, 53, 0.22) !important;
    transition: 0.22s ease;
    text-decoration: none !important;
}

#order-standard_cart.domain-register-modern .domain-promo-box .btn:hover {
    background: var(--brand-red-dark) !important;
    transform: translateY(-1px);
}

/* Domain pricing section */
#order-standard_cart.domain-register-modern .domain-pricing {
    margin-top: 34px;
}

#order-standard_cart.domain-register-modern .domain-pricing h4 {
    margin-bottom: 14px !important;
    color: var(--brand-text) !important;
    font-size: 24px !important;
    font-weight: 800 !important;
}

/* TLD filters */
#order-standard_cart.domain-register-modern .tld-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 24px;
}

#order-standard_cart.domain-register-modern .tld-filters a {
    padding: 8px 12px !important;
    border-radius: 10px !important;
    background: #eef2f7 !important;
    color: #344054 !important;
    border: 1px solid transparent !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transition: 0.22s ease;
}

#order-standard_cart.domain-register-modern .tld-filters a:hover,
#order-standard_cart.domain-register-modern .tld-filters a.badge-success {
    background: var(--brand-red) !important;
    color: #fff !important;
}

/* Featured TLD cards */
#order-standard_cart.domain-register-modern .featured-tld {
    border: 1px solid var(--brand-border) !important;
    border-radius: 18px !important;
    overflow: hidden;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08) !important;
    transition: 0.22s ease;
}

#order-standard_cart.domain-register-modern .featured-tld:hover {
    transform: translateY(-3px);
}

#order-standard_cart.domain-register-modern .featured-tld .img-container {
    min-height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
}

#order-standard_cart.domain-register-modern .featured-tld img {
    max-width: 82%;
    max-height: 95px;
    object-fit: contain;
}

#order-standard_cart.domain-register-modern .featured-tld .price {
    padding: 14px 16px !important;
    border-top: 1px solid var(--brand-border);
    background: #f8fafc !important;
    color: var(--brand-text) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    text-align: center;
}

/* Pricing table */
#order-standard_cart.domain-register-modern .domain-pricing .bg-white {
    border: 1px solid var(--brand-border);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.07);
}

#order-standard_cart.domain-register-modern .tld-pricing-header {
    background: var(--brand-navy) !important;
    color: #fff !important;
    font-weight: 800;
}

#order-standard_cart.domain-register-modern .tld-pricing-header > div,
#order-standard_cart.domain-register-modern .tld-pricing-header .row > div {
    padding: 15px 14px !important;
    color: #fff !important;
    font-size: 14px;
    font-weight: 800;
}

#order-standard_cart.domain-register-modern .tld-row {
    border-bottom: 1px solid var(--brand-border);
    background: #fff;
}

#order-standard_cart.domain-register-modern .tld-row > div {
    padding: 15px 14px !important;
}

#order-standard_cart.domain-register-modern .tld-row:hover {
    background: #fbfcfe;
}

#order-standard_cart.domain-register-modern .tld-row strong {
    color: var(--brand-navy);
    font-size: 17px;
    font-weight: 800;
}

#order-standard_cart.domain-register-modern .tld-row small {
    color: var(--brand-muted) !important;
}

/* Sale group */
#order-standard_cart.domain-register-modern .tld-sale-group {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin-left: 7px;
    padding: 4px 7px !important;
    border-radius: 7px !important;
    background: #ef4444 !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    text-transform: uppercase;
}

/* Responsive */
@media (max-width: 767px) {
    #order-standard_cart.domain-register-modern .cart-body > p {
        font-size: 16px;
    }

    #order-standard_cart.domain-register-modern .domain-checker-bg {
        padding: 34px 16px !important;
    }

    #order-standard_cart.domain-register-modern .input-group-box {
        flex-direction: column;
        gap: 10px;
    }

    #order-standard_cart.domain-register-modern #inputDomain,
    #order-standard_cart.domain-register-modern #btnCheckAvailability {
        width: 100%;
        min-height: 54px !important;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box {
        min-height: auto;
        text-align: center;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box h3,
    #order-standard_cart.domain-register-modern .domain-promo-box p {
        max-width: 100%;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box i {
        position: static;
        display: block;
        margin-bottom: 12px;
        font-size: 42px !important;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box .btn {
        width: 100%;
        min-width: auto;
    }

    #order-standard_cart.domain-register-modern .domain-pricing .bg-white {
        overflow-x: auto;
    }

    #order-standard_cart.domain-register-modern .tld-pricing-header,
    #order-standard_cart.domain-register-modern .tld-row {
        min-width: 720px;
    }
}/* =========================================
   Register Domain - Search Box + Promo Cards Upgrade
========================================= */

/* Search area - cleaner premium look */
#order-standard_cart.domain-register-modern .domain-checker-container {
    position: relative;
    overflow: hidden;
    max-width: 100%;
    margin: 0 0 38px !important;
    border-radius: 26px !important;
    background:
        linear-gradient(135deg, rgba(19, 41, 56, 0.96), rgba(29, 68, 82, 0.94)),
        linear-gradient(135deg, #132938, #1d4452) !important;
    box-shadow: 0 22px 55px rgba(15, 23, 42, 0.16) !important;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

/* Animated soft shapes */
#order-standard_cart.domain-register-modern .domain-checker-container::before {
    content: "";
    position: absolute;
    width: 260px;
    height: 260px;
    right: -80px;
    top: -90px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.10);
    animation: domainFloatOne 7s ease-in-out infinite;
}

#order-standard_cart.domain-register-modern .domain-checker-container::after {
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    left: -80px;
    bottom: -90px;
    border-radius: 50%;
    background: rgba(196, 49, 53, 0.16);
    animation: domainFloatTwo 8s ease-in-out infinite;
}

@keyframes domainFloatOne {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(-18px, 18px) scale(1.06);
    }
}

@keyframes domainFloatTwo {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(18px, -16px) scale(1.08);
    }
}

/* Search box spacing */
#order-standard_cart.domain-register-modern .domain-checker-bg {
    position: relative;
    z-index: 2;
    padding: 62px 28px !important;
    background: transparent !important;
}

/* Inner white search container */
#order-standard_cart.domain-register-modern .input-group-box {
    position: relative;
    max-width: 760px;
    margin: 0 auto;
    padding: 10px;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.75);
    transition: all 0.25s ease;
}

#order-standard_cart.domain-register-modern .input-group-box:focus-within {
    transform: translateY(-3px);
    box-shadow: 0 24px 55px rgba(0, 0, 0, 0.22);
}

/* Search input */
#order-standard_cart.domain-register-modern #inputDomain {
    min-height: 62px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    color: #1f2937 !important;
    font-size: 18px !important;
    padding: 15px 20px !important;
    box-shadow: none !important;
    transition: all 0.25s ease;
}

#order-standard_cart.domain-register-modern #inputDomain:focus {
    border-color: #c43135 !important;
    box-shadow: 0 0 0 4px rgba(196, 49, 53, 0.12) !important;
}

#order-standard_cart.domain-register-modern #inputDomain::placeholder {
    color: #98a2b3 !important;
}

/* Search button */
#order-standard_cart.domain-register-modern #btnCheckAvailability {
    min-height: 62px !important;
    min-width: 140px;
    border: 0 !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #c43135, #a7282c) !important;
    color: #ffffff !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    padding: 14px 28px !important;
    box-shadow: 0 14px 32px rgba(196, 49, 53, 0.30) !important;
    transition: all 0.25s ease;
}

#order-standard_cart.domain-register-modern #btnCheckAvailability:hover {
    transform: translateY(-2px);
    background: linear-gradient(135deg, #b52b30, #8f2024) !important;
    box-shadow: 0 20px 42px rgba(196, 49, 53, 0.38) !important;
}

/* Lower cards layout spacing */
#order-standard_cart.domain-register-modern .cart-body > .row:last-of-type {
    align-items: stretch;
    margin-top: 34px;
}

/* Promo cards base */
#order-standard_cart.domain-register-modern .domain-promo-box {
    position: relative;
    overflow: hidden;
    height: 100%;
    min-height: 255px;
    margin-top: 0 !important;
    padding: 34px 32px !important;
    border: 1px solid #e7ebf1 !important;
    border-radius: 24px !important;
    background:
        radial-gradient(circle at top right, rgba(196, 49, 53, 0.08), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, #f8fafc 100%) !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.10) !important;
    text-align: left;
    transition: all 0.28s ease;
}

/* Animated card shapes */
#order-standard_cart.domain-register-modern .domain-promo-box::before {
    content: "";
    position: absolute;
    top: -75px;
    right: -70px;
    width: 185px;
    height: 185px;
    border-radius: 50%;
    background: rgba(196, 49, 53, 0.08);
    transition: all 0.35s ease;
}

#order-standard_cart.domain-register-modern .domain-promo-box::after {
    content: "";
    position: absolute;
    bottom: -90px;
    left: -85px;
    width: 210px;
    height: 210px;
    border-radius: 50%;
    background: rgba(19, 41, 56, 0.06);
    transition: all 0.35s ease;
}

#order-standard_cart.domain-register-modern .domain-promo-box:hover {
    transform: translateY(-6px);
    box-shadow: 0 28px 62px rgba(15, 23, 42, 0.16) !important;
    border-color: rgba(196, 49, 53, 0.22) !important;
}

#order-standard_cart.domain-register-modern .domain-promo-box:hover::before {
    transform: scale(1.14) translate(-8px, 8px);
}

#order-standard_cart.domain-register-modern .domain-promo-box:hover::after {
    transform: scale(1.12) translate(8px, -8px);
}

/* Card content above shapes */
#order-standard_cart.domain-register-modern .domain-promo-box > * {
    position: relative;
    z-index: 2;
}

/* Icons */
#order-standard_cart.domain-register-modern .domain-promo-box i {
    position: absolute;
    top: 30px;
    right: 30px;
    width: 62px;
    height: 62px;
    border-radius: 18px;
    background: rgba(19, 41, 56, 0.08);
    color: #132938 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px !important;
    opacity: 1;
}

/* Card title */
#order-standard_cart.domain-register-modern .domain-promo-box h3 {
    max-width: calc(100% - 88px);
    margin: 0 0 10px !important;
    color: #1f2937 !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    line-height: 1.3;
    letter-spacing: -0.4px;
}

/* Highlight subtitle */
#order-standard_cart.domain-register-modern .domain-promo-box .text-warning,
#order-standard_cart.domain-register-modern .domain-promo-box .text-primary {
    display: block;
    margin-bottom: 12px;
    font-size: 15px !important;
    font-weight: 800 !important;
}

#order-standard_cart.domain-register-modern .domain-promo-box .text-warning {
    color: #d89400 !important;
}

#order-standard_cart.domain-register-modern .domain-promo-box .text-primary {
    color: #355e98 !important;
}

/* Normal text */
#order-standard_cart.domain-register-modern .domain-promo-box p {
    max-width: 86%;
    margin-bottom: 14px;
    color: #667085 !important;
    font-size: 15px;
    line-height: 1.8;
}

/* Buttons inside cards */
#order-standard_cart.domain-register-modern .domain-promo-box .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 220px;
    margin-top: 12px;
    border: 0 !important;
    border-radius: 14px !important;
    background: #c43135 !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    padding: 14px 24px !important;
    box-shadow: 0 14px 30px rgba(196, 49, 53, 0.24) !important;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

#order-standard_cart.domain-register-modern .domain-promo-box .btn:hover {
    background: #a7282c !important;
    transform: translateY(-2px);
    box-shadow: 0 20px 42px rgba(196, 49, 53, 0.32) !important;
}

/* Small note */
#order-standard_cart.domain-register-modern .domain-promo-box .small {
    display: block;
    margin-top: 14px;
    color: #98a2b3 !important;
    font-size: 13px;
}

/* Make both lower cards equal height */
#order-standard_cart.domain-register-modern .cart-body > .row:last-of-type > div {
    display: flex;
}

#order-standard_cart.domain-register-modern .cart-body > .row:last-of-type .domain-promo-box {
    width: 100%;
}

/* Mobile */
@media (max-width: 767px) {
    #order-standard_cart.domain-register-modern .domain-checker-bg {
        padding: 36px 16px !important;
    }

    #order-standard_cart.domain-register-modern .input-group-box {
        flex-direction: column;
        gap: 10px;
        padding: 10px;
        border-radius: 18px !important;
    }

    #order-standard_cart.domain-register-modern #inputDomain,
    #order-standard_cart.domain-register-modern #btnCheckAvailability {
        width: 100%;
        min-height: 56px !important;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box {
        min-height: auto;
        padding: 28px 22px !important;
        text-align: center;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box i {
        position: relative;
        top: auto;
        right: auto;
        margin: 0 auto 16px;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box h3,
    #order-standard_cart.domain-register-modern .domain-promo-box p {
        max-width: 100%;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box .btn {
        width: 100%;
        min-width: auto;
    }
}
/* Fix promo card icon overlap */
#order-standard_cart.domain-register-modern .domain-promo-box .clearfix {
    position: static !important;
}

#order-standard_cart.domain-register-modern .domain-promo-box i.fas {
    position: absolute !important;
    top: 28px !important;
    right: 28px !important;
    width: 58px !important;
    height: 58px !important;
    border-radius: 18px !important;
    background: rgba(19, 41, 56, 0.08) !important;
    color: #132938 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 28px !important;
    line-height: 1 !important;
    z-index: 3 !important;
    float: none !important;
    margin: 0 !important;
}

#order-standard_cart.domain-register-modern .domain-promo-box h3 {
    padding-right: 86px !important;
    max-width: 100% !important;
}

#order-standard_cart.domain-register-modern .domain-promo-box .text-warning,
#order-standard_cart.domain-register-modern .domain-promo-box .text-primary {
    padding-right: 86px !important;
}

/* Mobile: icon returns above text */
@media (max-width: 767px) {
    #order-standard_cart.domain-register-modern .domain-promo-box i.fas {
        position: static !important;
        margin: 0 auto 16px !important;
    }

    #order-standard_cart.domain-register-modern .domain-promo-box h3,
    #order-standard_cart.domain-register-modern .domain-promo-box .text-warning,
    #order-standard_cart.domain-register-modern .domain-promo-box .text-primary {
        padding-right: 0 !important;
    }
}
/* =========================================
   Horanos Premium SSL Landing Page
========================================= */

.ssl-modern-page {
    --ssl-red: #c43135;
    --ssl-red-dark: #a7282c;
    --ssl-navy: #132938;
    --ssl-navy-2: #0b1822;
    --ssl-text: #1f2937;
    --ssl-muted: #667085;
    --ssl-border: #e7ebf1;
    --ssl-soft: #f8fafc;
    --ssl-shadow: 0 20px 50px rgba(15, 23, 42, 0.10);

    background: #f7f8fb !important;
    color: var(--ssl-text);
}

/* General container spacing */
.ssl-modern-page .container {
    position: relative;
}

/* =========================================
   Hero
========================================= */

.ssl-modern-page .hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 0;
    padding: 86px 0 92px !important;
    background:
        radial-gradient(circle at top right, rgba(196, 49, 53, 0.20), transparent 30%),
        radial-gradient(circle at bottom left, rgba(255, 255, 255, 0.12), transparent 35%),
        linear-gradient(135deg, #132938 0%, #1d4452 55%, #0b1822 100%) !important;
    color: #ffffff;
}

.ssl-modern-page .hero:before {
    content: "";
    position: absolute;
    top: -90px;
    right: -70px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    animation: sslFloatOne 8s ease-in-out infinite;
}

.ssl-modern-page .hero:after {
    content: "";
    position: absolute;
    bottom: -110px;
    left: -90px;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    background: rgba(196, 49, 53, 0.18);
    animation: sslFloatTwo 9s ease-in-out infinite;
}

@keyframes sslFloatOne {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(-18px, 16px) scale(1.07);
    }
}

@keyframes sslFloatTwo {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(18px, -16px) scale(1.08);
    }
}

.ssl-modern-page .hero .container {
    z-index: 2;
}

.ssl-modern-page .hero h2 {
    max-width: 900px;
    margin: 0 auto 18px !important;
    color: #ffffff !important;
    font-size: 50px !important;
    font-weight: 900 !important;
    line-height: 1.2;
    letter-spacing: -1px;
    text-align: center;
}

.ssl-modern-page .hero h3 {
    max-width: 780px;
    margin: 0 auto !important;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1.8;
    text-align: center;
}

/* =========================================
   Validation Levels / Certificates
========================================= */

.ssl-modern-page .validation-levels {
    padding: 70px 0 !important;
    background: #f7f8fb !important;
}

.ssl-modern-page .validation-levels h3 {
    margin: 0 0 34px !important;
    color: var(--ssl-text) !important;
    font-size: 34px !important;
    font-weight: 900 !important;
    text-align: center;
}

.ssl-modern-page .validation-levels .row {
    align-items: stretch;
}

.ssl-modern-page .validation-levels [class*="col-"] {
    margin-bottom: 24px;
}

/* Certificate cards from included file */
.ssl-modern-page .validation-levels .item,
.ssl-modern-page .validation-levels .certificate,
.ssl-modern-page .validation-levels .card,
.ssl-modern-page .validation-levels .panel,
.ssl-modern-page .validation-levels .product {
    height: 100%;
    border: 1px solid var(--ssl-border) !important;
    border-radius: 26px !important;
    overflow: hidden;
    background: #ffffff !important;
    box-shadow: var(--ssl-shadow) !important;
    transition: all 0.28s ease;
}

.ssl-modern-page .validation-levels .item:hover,
.ssl-modern-page .validation-levels .certificate:hover,
.ssl-modern-page .validation-levels .card:hover,
.ssl-modern-page .validation-levels .panel:hover,
.ssl-modern-page .validation-levels .product:hover {
    transform: translateY(-6px);
    box-shadow: 0 30px 65px rgba(15, 23, 42, 0.16) !important;
    border-color: rgba(196, 49, 53, 0.25) !important;
}

.ssl-modern-page .help-me-choose {
    margin-top: 20px;
    text-align: center;
    color: var(--ssl-muted);
    font-size: 16px;
}

.ssl-modern-page .help-me-choose a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 6px 8px;
    padding: 12px 18px;
    border-radius: 999px;
    background: #ffffff;
    color: var(--ssl-red) !important;
    font-weight: 800;
    text-decoration: none !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    transition: all 0.25s ease;
}

.ssl-modern-page .help-me-choose a:hover {
    background: var(--ssl-red);
    color: #ffffff !important;
    transform: translateY(-2px);
}

/* =========================================
   Store SSL Navigation
========================================= */

.ssl-modern-page .nav,
.ssl-modern-page .store-nav,
.ssl-modern-page .ssl-nav {
    border-radius: 18px;
}

.ssl-modern-page a {
    transition: all 0.25s ease;
}

/* =========================================
   Content Blocks
========================================= */

.ssl-modern-page .content-block {
    padding: 76px 0 !important;
    background: #ffffff;
}

.ssl-modern-page .content-block.standout,
.ssl-modern-page .standout {
    background:
        radial-gradient(circle at top right, rgba(196, 49, 53, 0.06), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f8fafc 100%) !important;
}

.ssl-modern-page .content-block h2 {
    margin: 0 0 22px !important;
    color: var(--ssl-text) !important;
    font-size: 38px !important;
    font-weight: 900 !important;
    line-height: 1.3;
    letter-spacing: -0.5px;
}

.ssl-modern-page .content-block h4 {
    margin-bottom: 18px !important;
    color: #344054 !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.5;
}

.ssl-modern-page .content-block p {
    color: var(--ssl-muted) !important;
    font-size: 16px;
    line-height: 1.9;
}

.ssl-modern-page .content-block ul {
    padding-left: 0;
    list-style: none;
}

.ssl-modern-page .content-block ul li {
    position: relative;
    margin-bottom: 12px;
    color: #344054;
    font-size: 16px;
    line-height: 1.8;
}

.ssl-modern-page .content-block ul li i {
    margin-right: 8px;
    color: #16a34a !important;
}

/* Images */
.ssl-modern-page .content-block img {
    max-width: 100%;
    border-radius: 20px;
}

.ssl-modern-page .what-is-ssl img.float-md-right {
    max-width: 360px;
    padding: 18px;
    background: #ffffff;
    border: 1px solid var(--ssl-border);
    box-shadow: var(--ssl-shadow);
}

/* =========================================
   Benefits Section
========================================= */

.ssl-modern-page .ssl-benefits .row {
    margin-top: 34px;
}

.ssl-modern-page .ssl-benefits .row > div {
    margin-bottom: 22px;
    padding: 26px 18px !important;
    border-radius: 22px;
    background: #ffffff;
    border: 1px solid var(--ssl-border);
    box-shadow: 0 16px 35px rgba(15, 23, 42, 0.07);
    color: var(--ssl-text);
    font-weight: 800;
    text-align: center;
    transition: all 0.25s ease;
}

.ssl-modern-page .ssl-benefits .row > div:hover {
    transform: translateY(-5px);
    box-shadow: 0 24px 55px rgba(15, 23, 42, 0.13);
}

.ssl-modern-page .ssl-benefits .row > div i {
    display: flex;
    width: 58px;
    height: 58px;
    margin: 0 auto 14px;
    border-radius: 18px;
    align-items: center;
    justify-content: center;
    background: rgba(196, 49, 53, 0.10);
    color: var(--ssl-red) !important;
    font-size: 24px;
}

/* =========================================
   Browser Warning Section
========================================= */

.ssl-modern-page .standout-1 {
    position: relative;
    overflow: hidden;
    padding: 76px 0 0;
    background:
        linear-gradient(135deg, #132938 0%, #1d4452 100%) !important;
    color: #ffffff;
}

.ssl-modern-page .standout-1 h3 {
    color: #ffffff !important;
    font-size: 34px !important;
    font-weight: 900 !important;
    text-align: center;
}

.ssl-modern-page .browser-image {
    margin-top: 28px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 26px 60px rgba(0, 0, 0, 0.28);
}

.ssl-modern-page .browser-image img {
    width: 100%;
    border-radius: 24px;
}

.ssl-modern-page .browser-notice {
    margin-top: 0;
    background: var(--ssl-red) !important;
    color: #ffffff !important;
}

.ssl-modern-page .browser-notice .wrapper {
    padding: 22px;
    font-size: 17px;
    font-weight: 800;
}

/* =========================================
   Red Promo Bar
========================================= */

.ssl-modern-page .competitive-upgrade-promo {
    padding: 38px 0 !important;
    background:
        linear-gradient(135deg, var(--ssl-red), var(--ssl-red-dark)) !important;
    color: #ffffff !important;
    text-align: center;
    font-size: 24px;
    font-weight: 900;
    line-height: 1.6;
}

/* =========================================
   Wildcard / EV Section
========================================= */

.ssl-modern-page .secure-wildcard {
    padding: 38px;
    border-radius: 28px;
    background: #ffffff;
    border: 1px solid var(--ssl-border);
    box-shadow: var(--ssl-shadow);
}

.ssl-modern-page .secure-wildcard .quote-section {
    padding: 28px;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(196, 49, 53, 0.10), transparent 35%),
        #f8fafc;
    border: 1px solid var(--ssl-border);
}

.ssl-modern-page .google-quote {
    display: block;
    margin-bottom: 18px;
    color: var(--ssl-text);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.8;
}

/* =========================================
   Accordion / Details
========================================= */

.ssl-modern-page .detailed-info {
    background: #f7f8fb !important;
}

.ssl-modern-page #sslAccordion {
    max-width: 1180px;
}

.ssl-modern-page #sslAccordion .card {
    margin-bottom: 18px;
    border: 1px solid var(--ssl-border) !important;
    border-radius: 22px !important;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.07);
}

.ssl-modern-page #sslAccordion .card-header {
    padding: 22px 26px !important;
    background: #ffffff !important;
    border-bottom: 1px solid var(--ssl-border) !important;
    cursor: pointer;
    transition: all 0.25s ease;
}

.ssl-modern-page #sslAccordion .card-header:hover {
    background: #f8fafc !important;
}

.ssl-modern-page #sslAccordion .card-header h4 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 !important;
    color: var(--ssl-text) !important;
    font-size: 20px !important;
    font-weight: 900 !important;
}

.ssl-modern-page #sslAccordion .arrow {
    display: inline-flex;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
    background: rgba(196, 49, 53, 0.10);
    color: var(--ssl-red);
}

.ssl-modern-page #sslAccordion .card-body {
    padding: 28px !important;
}

.ssl-modern-page .help-me-choose .col-md-4 {
    padding: 28px;
    border-radius: 22px;
    background: #ffffff;
    border: 1px solid var(--ssl-border);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.ssl-modern-page .help-me-choose .col-md-4 h4 {
    color: var(--ssl-text) !important;
    font-weight: 900 !important;
}

.ssl-modern-page .ideal {
    padding: 14px 16px;
    border-radius: 14px;
    background: #f8fafc;
    color: var(--ssl-text) !important;
    font-weight: 800;
}

/* All certificates list */
.ssl-modern-page .ssl-certs-all {
    padding: 0;
    margin: 0;
    list-style: none;
}

.ssl-modern-page .ssl-certs-all li {
    margin-bottom: 14px;
    padding: 22px;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid var(--ssl-border);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}

.ssl-modern-page .ssl-certs-all li.featured {
    border-color: rgba(196, 49, 53, 0.35);
    box-shadow: 0 16px 36px rgba(196, 49, 53, 0.10);
}

.ssl-modern-page .ssl-certs-all .price strong {
    color: var(--ssl-red);
    font-size: 24px;
    font-weight: 900;
}

/* =========================================
   Buttons
========================================= */

.ssl-modern-page .btn,
.ssl-modern-page .btn-primary,
.ssl-modern-page .btn-success,
.ssl-modern-page .btn-default {
    border-radius: 14px !important;
    padding: 13px 22px !important;
    font-weight: 900 !important;
    transition: all 0.25s ease;
}

.ssl-modern-page .btn-primary,
.ssl-modern-page .btn-success {
    border: 0 !important;
    background: var(--ssl-red) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 32px rgba(196, 49, 53, 0.24);
}

.ssl-modern-page .btn-primary:hover,
.ssl-modern-page .btn-success:hover {
    background: var(--ssl-red-dark) !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 20px 42px rgba(196, 49, 53, 0.32);
}

.ssl-modern-page .btn-default {
    background: #ffffff !important;
    border: 1px solid var(--ssl-border) !important;
    color: var(--ssl-text) !important;
}

.ssl-modern-page .btn-default:hover {
    background: #f8fafc !important;
    transform: translateY(-2px);
}

/* =========================================
   Responsive
========================================= */

@media (max-width: 991px) {
    .ssl-modern-page .hero {
        padding: 68px 0 72px !important;
    }

    .ssl-modern-page .hero h2 {
        font-size: 40px !important;
    }

    .ssl-modern-page .hero h3 {
        font-size: 19px !important;
    }

    .ssl-modern-page .content-block {
        padding: 58px 0 !important;
    }

    .ssl-modern-page .content-block h2 {
        font-size: 32px !important;
    }

    .ssl-modern-page .secure-wildcard {
        padding: 26px;
    }
}

@media (max-width: 767px) {
    .ssl-modern-page .hero {
        padding: 54px 0 58px !important;
    }

    .ssl-modern-page .hero h2 {
        font-size: 30px !important;
    }

    .ssl-modern-page .hero h3 {
        font-size: 16px !important;
    }

    .ssl-modern-page .validation-levels,
    .ssl-modern-page .content-block {
        padding: 46px 0 !important;
    }

    .ssl-modern-page .validation-levels h3,
    .ssl-modern-page .content-block h2,
    .ssl-modern-page .standout-1 h3 {
        font-size: 26px !important;
    }

    .ssl-modern-page .what-is-ssl img.float-md-right {
        float: none !important;
        margin: 0 auto 24px !important;
        display: block;
    }

    .ssl-modern-page .ssl-benefits .row > div {
        margin-bottom: 16px;
    }

    .ssl-modern-page .secure-wildcard {
        padding: 20px;
        border-radius: 22px;
    }

    .ssl-modern-page #sslAccordion .card-body {
        padding: 22px !important;
    }
}

/* =========================================
   HORANOS MOBILE DROPDOWN FINAL
========================================= */

@media (max-width: 1199px) {

  #header .hz-menu li {
    position: relative !important;
  }

  #header .hz-menu li .dropdown-menu {
    display: none !important;

    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    inset: auto !important;

    transform: none !important;
    float: none !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    margin: 8px 0 0 !important;
    padding: 8px !important;

    background: #082b31 !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 14px !important;
    box-shadow: none !important;

    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    overflow: visible !important;
  }

  #header .hz-menu li.mobile-open > .dropdown-menu {
    display: block !important;
  }

  #header .hz-menu li:hover > .dropdown-menu {
    display: none !important;
  }

  #header .hz-menu li.mobile-open:hover > .dropdown-menu {
    display: block !important;
  }

  #header .hz-menu li .dropdown-menu::before,
  #header .hz-menu li .dropdown-menu::after {
    display: none !important;
    content: none !important;
  }

  #header .hz-menu li .dropdown-menu li {
    display: block !important;
    width: 100% !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    background: transparent !important;
  }

  #header .hz-menu li .dropdown-menu a,
  #header .hz-menu li .dropdown-menu .dropdown-item {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    width: 100% !important;
    min-height: 44px !important;

    margin: 0 !important;
    padding: 11px 14px !important;

    color: #ffffff !important;
    background: rgba(255,255,255,.08) !important;

    border-radius: 10px !important;
    border: 0 !important;

    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.5 !important;

    text-align: right !important;
    white-space: normal !important;
    text-decoration: none !important;

    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  #header .hz-menu li .dropdown-menu a:hover,
  #header .hz-menu li .dropdown-menu .dropdown-item:hover {
    background: var(--PrimaryColor) !important;
    color: #ffffff !important;
  }
}

/* =====================================================
   HORANOS HEADER FINAL CLEAN CODE
   Desktop + Mobile + Dropdowns
   ضع هذا الكود آخر custom.css
===================================================== */

/* =========================
   Header Base
========================= */

.hz-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  direction: rtl;
  font-family: var(--CairoFont), "Cairo", sans-serif;
  background:
    radial-gradient(circle at 30% 0%, rgba(201,47,53,.12), transparent 34%),
    linear-gradient(135deg, #071f27 0%, #13232f 100%);
  border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 45px rgba(0,0,0,.22);
}

.hz-header,
.hz-header * {
  box-sizing: border-box;
}

.hz-header a {
  text-decoration: none !important;
}

/* كسر container المحدود داخل الهيدر */
#header > .container,
.hz-header > .container,
#header .container,
.hz-header .container {
  width: 100% !important;
  max-width: 100% !important;
}

/* =========================
   Desktop Layout
========================= */

@media (min-width: 992px) {

  #header .container,
  .hz-header .container {
    padding-left: clamp(28px, 4vw, 90px) !important;
    padding-right: clamp(28px, 4vw, 90px) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .hz-inner {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 96px;

    display: grid !important;
    grid-template-columns: minmax(285px, auto) minmax(0, 1fr) minmax(260px, auto);
    align-items: center;
    column-gap: clamp(28px, 4vw, 80px);
  }

  /* اليسار: الأزرار */
  .hz-actions {
    grid-column: 1;
    justify-self: start;

    display: flex;
    align-items: center;
    gap: clamp(14px, 1.5vw, 28px);

    margin: 0 !important;
    padding: 0 !important;
    order: unset !important;
  }

  /* الوسط: القائمة */
  .hz-nav {
    grid-column: 2;
    justify-self: center;

    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    order: unset !important;
  }

  .hz-menu {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;

    gap: clamp(34px, 3.6vw, 86px) !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .hz-menu > li {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap;
  }

  .hz-menu > li > a,
  .hz-menu .dropdown-toggle {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;

    padding: 12px 0 !important;
    color: #e8f0f2 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.4;
    white-space: nowrap !important;

    transition: color .22s ease, transform .22s ease;
  }

  .hz-menu > li:hover > a,
  .hz-menu > li.show > a,
  .hz-menu > li.open > a {
    color: #ff3b42 !important;
    transform: translateY(-2px);
  }

  .hz-menu .dropdown-toggle::after {
    margin-right: 8px !important;
    border-top-color: currentColor !important;
    transition: transform .22s ease;
  }

  .hz-menu li.dropdown:hover > .dropdown-toggle::after,
  .hz-menu li.dropdown.show > .dropdown-toggle::after,
  .hz-menu li.open > .dropdown-toggle::after {
    transform: rotate(180deg);
  }

  /* اليمين: الشعار */
  .hz-logo {
    grid-column: 3;
    justify-self: end;

    display: inline-flex;
    align-items: center;

    margin: 0 !important;
    padding: 0 !important;
    order: unset !important;
    flex-shrink: 0;
  }

  .hz-logo img {
    max-height: 54px !important;
    width: auto !important;
    display: block;
  }

  .hz-logo span {
    font-size: 38px;
    font-weight: 900;
    letter-spacing: 10px;
    color: #c92f35;
  }

  /* إخفاء زر الموبايل على الديسكتوب */
  .hz-toggle {
    display: none !important;
  }
}

/* =========================
   Header Buttons
========================= */

.hz-cart,
.hz-lang,
.hz-login,
.hz-toggle {
  height: 56px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.08);
  color: #fff !important;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  font-size: 17px;
  font-weight: 900;
  text-decoration: none !important;
  transition: .25s ease;
}

.hz-cart {
  width: 62px;
  position: relative;
}

.hz-cart span {
  position: absolute;
  top: -10px;
  right: -8px;

  min-width: 25px;
  height: 25px;
  border-radius: 50%;

  background: #ff3b42;
  color: #fff;

  font-size: 13px;
  line-height: 25px;
  text-align: center;
  box-shadow: 0 10px 22px rgba(255,59,66,.35);
}

.hz-lang {
  padding: 0 22px;
  cursor: pointer;
}

.hz-login {
  padding: 0 28px;
  background: linear-gradient(135deg, #ff3b42, #c92f35);
  box-shadow: 0 16px 30px rgba(201,47,53,.35);
}

.hz-cart:hover,
.hz-lang:hover,
.hz-toggle:hover {
  background: rgba(255,255,255,.13);
  color: #fff !important;
  transform: translateY(-2px);
}

.hz-login:hover {
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 20px 38px rgba(201,47,53,.48);
}

/* =========================
   Syria Flag
========================= */

.sy-new-flag {
  width: 30px;
  height: 20px;
  display: inline-block;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  background:
    linear-gradient(to bottom,
      #009246 0 33.33%,
      #ffffff 33.33% 66.66%,
      #111111 66.66% 100%
    );
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.55),
    0 0 0 1px rgba(0,0,0,.25),
    0 6px 12px rgba(0,0,0,.25);
}

.sy-new-flag::before,
.sy-new-flag::after {
  content: "★";
  position: absolute;
  top: 6px;
  color: #ce1126;
  font-size: 7px;
  line-height: 1;
}

.sy-new-flag::before {
  left: 8px;
}

.sy-new-flag::after {
  right: 8px;
}

/* =========================
   Desktop Dropdown
========================= */

@media (min-width: 992px) {

  .hz-header,
  .hz-inner,
  .hz-nav,
  .hz-menu,
  .hz-menu > li {
    overflow: visible !important;
  }

  .hz-menu .dropdown-menu {
    display: block !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;

    position: absolute !important;
    top: calc(100% + 18px) !important;
    right: 50% !important;
    left: auto !important;
    transform: translateX(50%) translateY(12px) scale(.96) !important;

    min-width: 270px !important;
    width: max-content !important;
    max-width: 360px !important;

    padding: 12px !important;
    margin: 0 !important;

    background: rgba(9,31,39,.96) !important;
    backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.10) !important;
    border-top: 3px solid #ff3b42 !important;
    border-radius: 18px !important;

    box-shadow:
      0 28px 60px rgba(0,0,0,.42),
      inset 0 1px 0 rgba(255,255,255,.08);

    transition:
      opacity .22s ease,
      transform .22s ease,
      visibility .22s ease;
  }

  .hz-menu .dropdown-menu::before {
    content: "";
    position: absolute;
    top: -9px;
    right: 50%;
    width: 16px;
    height: 16px;
    transform: translateX(50%) rotate(45deg);
    background: #ff3b42;
    border-radius: 3px;
  }

  .hz-menu li.dropdown:hover > .dropdown-menu,
  .hz-menu li.dropdown.show > .dropdown-menu,
  .hz-menu li.open > .dropdown-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transform: translateX(50%) translateY(0) scale(1) !important;
  }

  .hz-menu .dropdown-menu li {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .hz-menu .dropdown-menu a,
  .hz-menu .dropdown-menu .dropdown-item {
    position: relative;

    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;

    width: 100% !important;
    padding: 13px 14px !important;
    margin-bottom: 5px;

    color: rgba(240,238,247,.88) !important;
    background: transparent !important;

    border-radius: 13px;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.5;
    text-align: right;
    white-space: nowrap !important;

    transition:
      background .22s ease,
      color .22s ease,
      transform .22s ease,
      padding .22s ease;
  }

  .hz-menu .dropdown-menu a:last-child {
    margin-bottom: 0;
  }

  .hz-menu .dropdown-menu a::before,
  .hz-menu .dropdown-menu .dropdown-item::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ff3b42;
    opacity: .45;
    flex-shrink: 0;
    transition: .22s ease;
  }

  .hz-menu .dropdown-menu a:hover,
  .hz-menu .dropdown-menu .dropdown-item:hover {
    color: #fff !important;
    background: linear-gradient(135deg, rgba(255,59,66,.18), rgba(255,255,255,.07)) !important;
    transform: translateX(-6px);
    padding-right: 18px !important;
  }

  .hz-menu .dropdown-menu a:hover::before,
  .hz-menu .dropdown-menu .dropdown-item:hover::before {
    opacity: 1;
    box-shadow: 0 0 14px rgba(255,59,66,.65);
  }
}

/* =========================
   Laptop Fix
========================= */

@media (min-width: 992px) and (max-width: 1366px) {

  #header .container,
  .hz-header .container {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .hz-inner {
    grid-template-columns: minmax(250px, auto) minmax(0, 1fr) minmax(220px, auto);
    column-gap: 22px;
  }

  .hz-menu {
    gap: 28px !important;
  }

  .hz-menu > li > a,
  .hz-menu .dropdown-toggle {
    font-size: 16px !important;
  }

  .hz-actions {
    gap: 12px;
  }

  .hz-logo img {
    max-height: 46px !important;
  }

  .hz-login {
    padding-left: 22px;
    padding-right: 22px;
  }

  .hz-lang {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* =========================
   Mobile Layout
========================= */

@media (max-width: 991px) {

  .hz-header {
    position: sticky;
    top: 0;
  }

  #header .container,
  .hz-header .container {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .hz-inner {
    min-height: 78px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
  }

  .hz-logo {
    order: 1;
    margin: 0 !important;
    flex: 0 0 auto;
  }

  .hz-logo img {
    max-height: 42px !important;
    width: auto !important;
  }

  .hz-logo span {
    font-size: 24px;
    letter-spacing: 5px;
    color: #c92f35;
  }

  .hz-actions {
    order: 2;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 !important;
    margin-right: auto !important;
  }

  .hz-cart,
  .hz-lang,
  .hz-login,
  .hz-toggle {
    width: 46px;
    height: 46px;
    padding: 0 !important;
    border-radius: 14px;
    font-size: 15px;
  }

  .hz-lang span:first-child,
  .hz-login span {
    display: none !important;
  }

  .hz-toggle {
    display: inline-flex !important;
    order: 3;
    cursor: pointer;
  }

  .hz-nav {
    order: 4;
    flex-basis: 100%;
    width: 100%;

    display: none !important;

    padding: 14px;
    margin-top: 8px;

    background: rgba(255,255,255,.06);
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.08);
  }

  .hz-nav.show {
    display: block !important;
  }

  .hz-menu {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .hz-menu > li {
    display: block !important;
    width: 100% !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
  }

  .hz-menu > li:last-child {
    margin-bottom: 0 !important;
  }

  .hz-menu > li > a,
  .hz-menu .dropdown-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    min-height: 48px !important;

    padding: 13px 16px !important;

    border-radius: 14px !important;
    background: rgba(255,255,255,.05) !important;
    color: #fff !important;

    font-size: 15px !important;
    font-weight: 800 !important;
    white-space: normal !important;
  }

  .hz-menu > li > a:hover,
  .hz-menu .dropdown-toggle:hover {
    background: rgba(255,59,66,.20) !important;
    color: #fff !important;
  }
}

/* =========================
   Mobile Dropdown
========================= */

@media (max-width: 991px) {

  .hz-menu li {
    position: relative !important;
  }

  .hz-menu li .dropdown-menu {
    display: none !important;

    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    transform: none !important;
    float: none !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 8px 0 0 !important;
    padding: 8px !important;

    background: #082b31 !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 14px !important;
    box-shadow: none !important;

    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .hz-menu li.mobile-open > .dropdown-menu,
  .hz-menu li.open > .dropdown-menu,
  .hz-menu li.show > .dropdown-menu,
  .hz-menu li.dropdown.show > .dropdown-menu {
    display: block !important;
  }

  .hz-menu li:hover > .dropdown-menu {
    display: none !important;
  }

  .hz-menu li.mobile-open:hover > .dropdown-menu,
  .hz-menu li.open:hover > .dropdown-menu,
  .hz-menu li.show:hover > .dropdown-menu {
    display: block !important;
  }

  .hz-menu li .dropdown-menu::before,
  .hz-menu li .dropdown-menu::after {
    display: none !important;
    content: none !important;
  }

  .hz-menu li .dropdown-menu li {
    display: block !important;
    width: 100% !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    background: transparent !important;
  }

  .hz-menu li .dropdown-menu li:last-child {
    margin-bottom: 0 !important;
  }

  .hz-menu li .dropdown-menu a,
  .hz-menu li .dropdown-menu .dropdown-item {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    width: 100% !important;
    min-height: 44px !important;

    margin: 0 !important;
    padding: 11px 14px !important;

    color: #ffffff !important;
    background: rgba(255,255,255,.08) !important;

    border-radius: 10px !important;
    border: 0 !important;

    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.5 !important;

    text-align: right !important;
    white-space: normal !important;
    text-decoration: none !important;

    transform: none !important;
  }

  .hz-menu li .dropdown-menu a:hover,
  .hz-menu li .dropdown-menu .dropdown-item:hover {
    background: var(--PrimaryColor, #BB3030) !important;
    color: #ffffff !important;
  }
}

/* =========================
   Small Mobile
========================= */

@media (max-width: 576px) {

  #header .container,
  .hz-header .container {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .hz-inner {
    min-height: 68px;
    gap: 6px;
  }

  .hz-logo img {
    max-height: 36px !important;
  }

  .hz-cart,
  .hz-lang,
  .hz-login,
  .hz-toggle {
    width: 42px;
    height: 42px;
    border-radius: 13px;
  }

  .hz-cart span {
    top: -8px;
    right: -6px;
    min-width: 20px;
    height: 20px;
    font-size: 11px;
    line-height: 20px;
  }

  .sy-new-flag {
    width: 24px;
    height: 16px;
  }

  .sy-new-flag::before,
  .sy-new-flag::after {
    top: 5px;
    font-size: 6px;
  }

  .sy-new-flag::before {
    left: 6px;
  }

  .sy-new-flag::after {
    right: 6px;
  }
}

/* =========================
   Safety Fixes
========================= */

.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
  background-color: transparent !important;
}

#header,
.hz-header {
  overflow: visible !important;
}

.btn,
a.btn,
button,
input[type="submit"],
input[type="button"] {
  max-width: none;
  text-overflow: unset;
}
/* =====================================================
   HORANOS HEADER FINAL COMPACT FIX
   ضع هذا الكود آخر ملف custom.css
===================================================== */

@media (min-width: 992px) {

  #header,
  .hz-header {
    min-height: 92px !important;
    height: 92px !important;
    max-height: 92px !important;
    overflow: visible !important;
  }

  #header .container,
  .hz-header .container {
    width: 100% !important;
    max-width: 100% !important;
    height: 92px !important;
    padding: 0 30px !important;
    margin: 0 !important;
  }

  .hz-inner {
    direction: ltr !important;

    height: 92px !important;
    min-height: 92px !important;
    max-height: 92px !important;

    display: grid !important;
    grid-template-columns: 430px minmax(0, 1fr) 210px !important;
    align-items: center !important;
    gap: 10px !important;

    padding: 0 !important;
    margin: 0 !important;
    flex-wrap: nowrap !important;
  }

  .hz-actions {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;

    direction: rtl !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;

    margin: 0 !important;
    padding: 0 !important;
    flex-wrap: nowrap !important;
  }

  .hz-nav {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;

    direction: rtl !important;
    width: 100% !important;
    min-width: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;
    flex: none !important;
  }

  .hz-logo {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;

    direction: rtl !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: none !important;
  }

  .hz-logo img {
    max-height: 36px !important;
    width: auto !important;
    display: block !important;
  }

  .hz-logo span {
    font-size: 25px !important;
    letter-spacing: 5px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  .hz-menu {
    width: 100% !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;

    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .hz-menu > li {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
  }

  .hz-menu > li > a,
  .hz-menu .dropdown-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;

    padding: 8px 0 !important;
    margin: 0 !important;

    font-size: 13.5px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    letter-spacing: 0 !important;
  }

  .hz-menu .dropdown-toggle::after {
    margin-right: 6px !important;
    margin-left: 0 !important;
    transform: scale(.85) !important;
  }

  .hz-cart,
  .hz-lang,
  .hz-login {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    border-radius: 15px !important;
    flex-shrink: 0 !important;
    font-size: 13.5px !important;
  }

  .hz-cart {
    width: 52px !important;
    min-width: 52px !important;
  }

  .hz-cart span {
    top: -9px !important;
    right: -7px !important;
    min-width: 23px !important;
    height: 23px !important;
    line-height: 23px !important;
    font-size: 12px !important;
  }

  .hz-lang {
    padding-left: 13px !important;
    padding-right: 13px !important;
  }

  .hz-login {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .hz-login span,
  .hz-lang span {
    white-space: nowrap !important;
  }

  .hz-toggle {
    display: none !important;
  }

  #header,
  #header .hz-inner,
  #header .hz-nav,
  #header .hz-menu,
  #header .hz-menu > li {
    overflow: visible !important;
  }
}

/* لابتوب وشاشات 1366 */
@media (min-width: 992px) and (max-width: 1400px) {

  #header .container,
  .hz-header .container {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .hz-inner {
    grid-template-columns: 375px minmax(0, 1fr) 180px !important;
    gap: 8px !important;
  }

  .hz-menu {
    gap: 9px !important;
  }

  .hz-menu > li > a,
  .hz-menu .dropdown-toggle {
    font-size: 12.5px !important;
    font-weight: 800 !important;
  }

  .hz-logo img {
    max-height: 32px !important;
  }

  .hz-logo span {
    font-size: 22px !important;
    letter-spacing: 4px !important;
  }

  .hz-actions {
    gap: 8px !important;
  }

  .hz-cart,
  .hz-lang,
  .hz-login {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 44px !important;
    border-radius: 14px !important;
    font-size: 12.5px !important;
  }

  .hz-cart {
    width: 48px !important;
    min-width: 48px !important;
  }

  .hz-lang {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .hz-login {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* شاشات أصغر من 1200: إخفاء كلمة تسجيل الدخول وترك الأيقونة */
@media (min-width: 992px) and (max-width: 1200px) {

  .hz-inner {
    grid-template-columns: 270px minmax(0, 1fr) 160px !important;
  }

  .hz-login span {
    display: none !important;
  }

  .hz-login {
    width: 48px !important;
    min-width: 48px !important;
    padding: 0 !important;
  }

  .hz-menu {
    gap: 7px !important;
  }

  .hz-menu > li > a,
  .hz-menu .dropdown-toggle {
    font-size: 12px !important;
  }
}
/* =====================================================
   HORANOS HEADER ACCOUNT MENU ALIGN FIX
   يصلح تباعد الحساب / Ramy داخل الهيدر
===================================================== */

@media (min-width: 992px) {

  .hz-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;
    flex-wrap: nowrap !important;
  }

  .hz-menu,
  .hz-menu-account {
    width: auto !important;
    flex: 0 0 auto !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;

    gap: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .hz-menu > li,
  .hz-menu-account > li {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    flex: 0 0 auto !important;
  }

  .hz-menu > li > a,
  .hz-menu-account > li > a,
  .hz-menu .dropdown-toggle,
  .hz-menu-account .dropdown-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;

    padding: 8px 0 !important;
    margin: 0 !important;

    color: #e8f0f2 !important;
    font-size: 13.5px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
  }

  .hz-menu-account {
    margin-inline-start: 8px !important;
  }

  .hz-menu-account::before {
    content: "" !important;
    width: 1px !important;
    height: 22px !important;
    background: rgba(255,255,255,.18) !important;
    margin-inline-end: 6px !important;
  }

  .hz-menu-account .dropdown-toggle::after,
  .hz-menu .dropdown-toggle::after {
    margin-right: 6px !important;
    margin-left: 0 !important;
    transform: scale(.85) !important;
  }
}

/* شاشات اللابتوب */
@media (min-width: 992px) and (max-width: 1400px) {

  .hz-nav {
    gap: 10px !important;
  }

  .hz-menu,
  .hz-menu-account {
    gap: 10px !important;
  }

  .hz-menu > li > a,
  .hz-menu-account > li > a,
  .hz-menu .dropdown-toggle,
  .hz-menu-account .dropdown-toggle {
    font-size: 12.5px !important;
  }

  .hz-menu-account {
    margin-inline-start: 4px !important;
  }

  .hz-menu-account::before {
    margin-inline-end: 3px !important;
  }
}

/* شاشات أضيق */
@media (min-width: 992px) and (max-width: 1200px) {

  .hz-menu,
  .hz-menu-account {
    gap: 7px !important;
  }

  .hz-menu > li > a,
  .hz-menu-account > li > a,
  .hz-menu .dropdown-toggle,
  .hz-menu-account .dropdown-toggle {
    font-size: 12px !important;
  }

  .hz-menu-account::before {
    display: none !important;
  }
}
/* =====================================================
   FIX DOMAIN SEARCH MOBILE CUT / INPUT / BUTTONS
===================================================== */

@media (max-width: 768px) {

  #frmDomainHomepage .ultra-domain-box {
    width: 100% !important;
    max-width: calc(100vw - 28px) !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 14px !important;

    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;

    overflow: visible !important;
    border-radius: 24px !important;
    box-sizing: border-box !important;
  }

  #frmDomainHomepage .ultra-domain-box input {
    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;

    padding: 0 18px !important;
    border-radius: 18px !important;

    text-align: center !important;
    direction: ltr !important;

    font-size: 18px !important;
    box-sizing: border-box !important;
  }

  #frmDomainHomepage .ultra-domain-actions {
    width: 100% !important;
    height: auto !important;

    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;

    order: 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #frmDomainHomepage .ultra-domain-actions button {
    width: 100% !important;
    min-width: 0 !important;
    height: 58px !important;

    border-radius: 18px !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    box-sizing: border-box !important;
  }

  #frmDomainHomepage .ultra-domain-actions button i {
    font-size: 22px !important;
    color: #ffffff !important;
  }

  #frmDomainHomepage .ultra-domain-search {
    background: var(--PrimaryColor) !important;
  }

  #frmDomainHomepage .ultra-domain-transfer {
    background: var(--SecondaryColor) !important;
  }
}

/* للشاشات الصغيرة جدًا */
@media (max-width: 430px) {

  #frmDomainHomepage .ultra-domain-box {
    max-width: calc(100vw - 20px) !important;
    padding: 12px !important;
  }

  #frmDomainHomepage .ultra-domain-box input {
    font-size: 16px !important;
  }

  #frmDomainHomepage .ultra-domain-actions button {
    height: 54px !important;
  }
}
/*تنسيق اقتراحات نتائج البحث*/
.suggested-domains {
    margin-top: 38px !important;
    border: 0 !important;
    border-radius: 28px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.10) !important;
    overflow: hidden !important;
}

.suggested-domains .panel-heading,
.suggested-domains .card-header {
    position: relative !important;
    padding: 28px 32px !important;
    border: 0 !important;
    background:
        radial-gradient(circle at top right, rgba(59,130,246,.28), transparent 32%),
        linear-gradient(135deg, #0f172a 0%, #172554 100%) !important;
    color: #ffffff !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    letter-spacing: -0.4px !important;
}

.suggested-domains .panel-heading::before,
.suggested-domains .card-header::before {
    content: "\f0ac" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
    width: 44px !important;
    height: 44px !important;
    margin-right: 12px !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.12) !important;
    color: #93c5fd !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    vertical-align: middle !important;
}

#domainSuggestions {
    padding: 22px !important;
    background: #f8fafc !important;
    border: 0 !important;
}

/* Card */
#domainSuggestions .domain-suggestion {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 56px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
    min-height: 98px !important;
    margin-bottom: 16px !important;
    padding: 20px 22px !important;
    border: 1px solid #e5edf6 !important;
    border-radius: 24px !important;
    background:
        radial-gradient(circle at top right, rgba(37,99,235,.07), transparent 28%),
        #ffffff !important;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.07) !important;
    transition: all .22s ease !important;
}

#domainSuggestions .domain-suggestion:hover {
    transform: translateY(-4px) !important;
    border-color: #bfdbfe !important;
    box-shadow: 0 22px 48px rgba(15, 23, 42, 0.12) !important;
}

#domainSuggestions .domain-suggestion:last-child {
    margin-bottom: 0 !important;
}

/* Icon before each domain */
#domainSuggestions .domain-suggestion::before {
    content: "\f57d" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
    width: 56px !important;
    height: 56px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #eff6ff, #dbeafe) !important;
    color: #2563eb !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 22px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 10px 22px rgba(37,99,235,.12) !important;
}

/* Domain name area */
#domainSuggestions .domain-suggestion .domain {
    color: #0f172a !important;
    font-size: 25px !important;
    font-weight: 950 !important;
    letter-spacing: -0.5px !important;
    line-height: 1.15 !important;
}

#domainSuggestions .domain-suggestion .extension {
    margin-left: 5px !important;
    color: #dc2626 !important;
    font-size: 25px !important;
    font-weight: 950 !important;
    letter-spacing: -0.5px !important;
}

/* Remove old icon if previous code exists */
#domainSuggestions .domain-suggestion .domain::before {
    content: none !important;
    display: none !important;
}

/* Promo badges */
#domainSuggestions .promo {
    display: inline-flex !important;
    margin-left: 12px !important;
    vertical-align: middle !important;
}

#domainSuggestions .sales-group-hot,
#domainSuggestions .sales-group-new,
#domainSuggestions .sales-group-sale {
    height: 34px !important;
    padding: 0 13px !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: .45px !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 10px 22px rgba(15,23,42,.12) !important;
}

#domainSuggestions .sales-group-hot {
    background: linear-gradient(135deg, #ef4444, #b91c1c) !important;
}

#domainSuggestions .sales-group-hot::before {
    content: "\f0e7" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
    margin-right: 6px !important;
}

#domainSuggestions .sales-group-new {
    background: linear-gradient(135deg, #10b981, #047857) !important;
}

#domainSuggestions .sales-group-new::before {
    content: "\f005" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
    margin-right: 6px !important;
}

#domainSuggestions .sales-group-sale {
    background: linear-gradient(135deg, #f97316, #c2410c) !important;
}

#domainSuggestions .sales-group-sale::before {
    content: "\f02b" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
    margin-right: 6px !important;
}

/* Right action area */
#domainSuggestions .actions {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
}

#domainSuggestions .actions .price {
    min-width: 142px !important;
    height: 50px !important;
    padding: 0 18px !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #ecfdf5, #dcfce7) !important;
    color: #14532d !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    font-weight: 950 !important;
    white-space: nowrap !important;
    border: 1px solid #bbf7d0 !important;
}

/* إزالة علامة الدولار الصغيرة الزائدة من أسعار اقتراحات النطاقات */
#domainSuggestions .actions .price::before {
    content: none !important;
    display: none !important;
}

#domainSuggestions .btn-add-to-cart {
    min-width: 158px !important;
    height: 50px !important;
    padding: 0 22px !important;
    border-radius: 16px !important;
    border: 0 !important;
    background: linear-gradient(135deg, #dc2626, #991b1b) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 950 !important;
    box-shadow: 0 14px 28px rgba(220,38,38,.24) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all .2s ease !important;
}

#domainSuggestions .btn-add-to-cart:hover {
    transform: translateY(-1px) !important;
    background: linear-gradient(135deg, #b91c1c, #7f1d1d) !important;
    color: #ffffff !important;
    box-shadow: 0 18px 34px rgba(220,38,38,.30) !important;
}

#domainSuggestions .btn-add-to-cart .to-add::before {
    content: "\f07a" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
    margin-right: 8px !important;
}

#domainSuggestions .btn-add-to-cart .loading,
#domainSuggestions .btn-add-to-cart .added,
#domainSuggestions .btn-add-to-cart .unavailable {
    display: none !important;
}

/* More suggestions footer */
.suggested-domains .panel-footer,
.suggested-domains .card-footer {
    background: #f8fafc !important;
    border-top: 1px solid #e5edf6 !important;
    padding: 18px 24px !important;
}

.suggested-domains .panel-footer a,
.suggested-domains .card-footer a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 44px !important;
    padding: 0 22px !important;
    border-radius: 999px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-weight: 900 !important;
    text-decoration: none !important;
}

.suggested-domains .panel-footer a::after,
.suggested-domains .card-footer a::after {
    content: "\f061" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
    margin-left: 9px !important;
    font-size: 13px !important;
}

.suggested-domains .domain-suggestions-warning {
    padding: 14px 26px 26px !important;
    background: #f8fafc !important;
    color: #64748b !important;
    font-size: 13px !important;
}

/* Mobile */
@media (max-width: 900px) {
    #domainSuggestions .domain-suggestion {
        grid-template-columns: 56px minmax(0, 1fr) !important;
    }

    #domainSuggestions .actions {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        justify-content: stretch !important;
    }

    #domainSuggestions .actions .price,
    #domainSuggestions .btn-add-to-cart {
        flex: 1 !important;
        min-width: 0 !important;
    }
}

@media (max-width: 560px) {
    .suggested-domains .panel-heading,
    .suggested-domains .card-header {
        padding: 22px !important;
        font-size: 20px !important;
    }

    #domainSuggestions {
        padding: 14px !important;
    }

    #domainSuggestions .domain-suggestion {
        grid-template-columns: 1fr !important;
        text-align: center !important;
        padding: 22px 18px !important;
    }

    #domainSuggestions .domain-suggestion::before {
        margin: 0 auto !important;
    }

    #domainSuggestions .domain-suggestion .domain,
    #domainSuggestions .domain-suggestion .extension {
        font-size: 22px !important;
    }

    #domainSuggestions .actions {
        flex-direction: column !important;
        gap: 10px !important;
    }

    #domainSuggestions .actions .price,
    #domainSuggestions .btn-add-to-cart {
        width: 100% !important;
    }
}
#spotlightTlds .custom-card-top .custom-domain-badge {
    position: static !important;
    transform: none !important;
    top: auto !important;
    right: auto !important;
}

/* Fix visible price */
#spotlightTlds .custom-domain-price.whmcs-force-show {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 50px !important;
    margin: 0 0 12px !important;
    padding: 0 12px !important;
    border-radius: 16px !important;
    background: #eef4ff !important;
    color: #2563eb !important;
    font-size: 17px !important;
    font-weight: 900 !important;
}

/* Fix visible add/unavailable buttons */
#spotlightTlds .custom-domain-btn.whmcs-force-show {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    height: 52px !important;
    min-height: 52px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 16px !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
}

#spotlightTlds .custom-domain-btn-add.whmcs-force-show {
    background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .24) !important;
}

#spotlightTlds .custom-domain-btn-disabled.whmcs-force-show {
    background: #eef2f7 !important;
    color: #99a3b3 !important;
    cursor: not-allowed !important;
}

/*تنسيق اقتراحات نتائج البحث*/
/* =========================================
   Fix Account Dropdown Dots + Hover Only
   Keep dropdown position unchanged
========================================= */

/* فتح القائمة عند تمرير الماوس */
li.dropdown:hover > .dropdown-menu,
.navbar-nav li.dropdown:hover > .dropdown-menu,
.main-menu li.dropdown:hover > .dropdown-menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* منع اختفاء القائمة عند الانتقال بالماوس */
li.dropdown > .dropdown-menu {
    pointer-events: auto !important;
}

/* إزالة النقاط الحمراء داخل القائمة فقط */
.dropdown-menu li::before,
.dropdown-menu li::after,
.dropdown-menu a::before,
.dropdown-menu a::after,
.dropdown-menu span::before,
.dropdown-menu span::after {
    content: none !important;
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

/* إزالة أي نقاط أو دوائر موجودة كعناصر HTML */
.dropdown-menu .dot,
.dropdown-menu .circle,
.dropdown-menu .badge,
.dropdown-menu .fa-circle,
.dropdown-menu i[class*="circle"],
.dropdown-menu span[class*="dot"],
.dropdown-menu span[class*="circle"] {
    display: none !important;
}

/* إزالة marker من li */
.dropdown-menu,
.dropdown-menu ul,
.dropdown-menu li {
    list-style: none !important;
    list-style-type: none !important;
}

.dropdown-menu li::marker {
    content: "" !important;
    display: none !important;
}

/* إصلاح اتجاه Forgot Password */
.dropdown-menu a[href*="pwreset"],
.dropdown-menu a[href*="password"],
.dropdown-menu a[href*="forgot"] {
    direction: ltr !important;
    unicode-bidi: plaintext !important;
    text-align: center !important;
}
/* =========================================
   Account dropdown final alignment
   Keep current position unchanged
========================================= */

/* فتح القائمة عند التمرير فقط */
li.dropdown:hover > .dropdown-menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* ضبط عناصر القائمة في المنتصف */
.dropdown-menu li > a,
.dropdown-menu a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    padding: 14px 18px !important;
    margin: 0 !important;

    text-align: center !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}

/* إصلاح Forgot Password */
.dropdown-menu a[href*="pwreset"],
.dropdown-menu a[href*="password"],
.dropdown-menu a[href*="forgot"] {
    direction: ltr !important;
    unicode-bidi: plaintext !important;
}

/* منع أي إزاحة داخلية من القالب */
.dropdown-menu li {
    padding: 0 !important;
    margin: 0 !important;
    text-align: center !important;
}

/* إظهار hover بشكل جميل */
.dropdown-menu li > a:hover,
.dropdown-menu a:hover {
    background: rgba(255, 55, 75, 0.18) !important;
    border-radius: 10px !important;
}
/* =========================================
   Disable click-sticky dropdown
   Show dropdown on hover only
========================================= */

/* إخفاء القائمة إذا فتحت بسبب الضغط */
.navbar-nav > li.dropdown.open > .dropdown-menu,
.main-menu > li.dropdown.open > .dropdown-menu,
ul.nav > li.dropdown.open > .dropdown-menu {
    display: none !important;
}

/* إظهار القائمة فقط عند التمرير */
.navbar-nav > li.dropdown:hover > .dropdown-menu,
.main-menu > li.dropdown:hover > .dropdown-menu,
ul.nav > li.dropdown:hover > .dropdown-menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* منع فتح أكثر من قائمة بسبب الضغط */
.navbar-nav > li.dropdown.open:not(:hover) > .dropdown-menu,
.main-menu > li.dropdown.open:not(:hover) > .dropdown-menu,
ul.nav > li.dropdown.open:not(:hover) > .dropdown-menu {
    display: none !important;
}
/* =========================================
   Dropdown hover only - no click sticky
========================================= */

/* إخفاء أي قائمة مفتوحة بسبب الضغط */
.navbar-nav > li.dropdown.open > .dropdown-menu,
.navbar-nav > li.dropdown.show > .dropdown-menu,
.main-menu > li.dropdown.open > .dropdown-menu,
.main-menu > li.dropdown.show > .dropdown-menu,
ul.nav > li.dropdown.open > .dropdown-menu,
ul.nav > li.dropdown.show > .dropdown-menu {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* إظهار القائمة فقط عند مرور الماوس */
.navbar-nav > li.dropdown:hover > .dropdown-menu,
.main-menu > li.dropdown:hover > .dropdown-menu,
ul.nav > li.dropdown:hover > .dropdown-menu {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* عند الابتعاد بالماوس تُغلق حتى لو عليها open أو show */
.navbar-nav > li.dropdown.open:not(:hover) > .dropdown-menu,
.navbar-nav > li.dropdown.show:not(:hover) > .dropdown-menu,
.main-menu > li.dropdown.open:not(:hover) > .dropdown-menu,
.main-menu > li.dropdown.show:not(:hover) > .dropdown-menu,
ul.nav > li.dropdown.open:not(:hover) > .dropdown-menu,
ul.nav > li.dropdown.show:not(:hover) > .dropdown-menu {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* إلغاء تأثير التركيز بعد الضغط */
.navbar-nav > li.dropdown > a:focus,
.main-menu > li.dropdown > a:focus,
ul.nav > li.dropdown > a:focus {
    outline: none !important;
    box-shadow: none !important;
}
/* إلغاء الخط العريض في العناوين المشار إليها */
.premium-hosting-hero h1,
.premium-hosting-hero h2,
.home-hero h1,
.home-hero h2,
section[class*="hero"] h1,
section[class*="hero"] h2,
div[class*="hero"] h1,
div[class*="hero"] h2,
.domain-search h1,
.domain-search h2,
.domain-section h1,
.domain-section h2,
section[class*="domain"] h1,
section[class*="domain"] h2,
div[class*="domain"] h1,
div[class*="domain"] h2 {
    font-weight: 400 !important;
}
/* إلغاء bold من عنوان قسم البحث عن النطاق فقط */
.ultra-domain-section .ultra-domain-header h2 {
    font-weight: 400 !important;
}
body.horanos-public-page #frmDomainHomepage .ultra-domain-section .ultra-domain-header > h2 {
    font-weight: 400 !important;
    font-family: inherit !important;
}
/* إلغاء bold من عنوان قسم البحث عن النطاق فقط */
/* تحسين توازن أزرار الهيدر */
.hz-header .btn,
.hz-header .language-btn,
.hz-header .cart-btn,
.hz-header a[href*="login"],
.hz-header a[href*="clientarea"] {
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* تصغير زر تسجيل الدخول */
.hz-header a[href*="login"],
.hz-header a[href*="clientarea"] {
    padding: 0 18px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

/* توحيد المسافات بين أزرار اليسار */
.hz-header .header-actions,
.hz-header .navbar-actions,
.hz-header .left-actions {
    gap: 10px !important;
}
/* =========================================
   Clean Header Layout
========================================= */

.hz-header {
    direction: ltr !important;
}

.hz-header .container,
.hz-header .header-inner,
.hz-header .navbar {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    gap: 24px !important;
}

/* الشعار */
.hz-header .navbar-brand,
.hz-header .hz-logo,
.hz-header .logo {
    order: 1 !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
}

/* القائمة */
.hz-header .navbar-nav,
.hz-header .main-menu,
.hz-header .hz-menu {
    order: 2 !important;
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
}

/* أزرار الدخول واللغة والسلة */
.hz-header .header-actions,
.hz-header .navbar-actions,
.hz-header .hz-actions {
    order: 3 !important;
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex: 0 0 auto !important;
}
html[lang="ar"] .hz-header .container,
html[lang="ar"] .hz-header .header-inner,
html[lang="ar"] .hz-header .navbar,
body[dir="rtl"] .hz-header .container,
body[dir="rtl"] .hz-header .header-inner,
body[dir="rtl"] .hz-header .navbar {
    flex-direction: row-reverse !important;
}

html[lang="ar"] .hz-header .header-actions,
html[lang="ar"] .hz-header .navbar-actions,
html[lang="ar"] .hz-header .hz-actions,
body[dir="rtl"] .hz-header .header-actions,
body[dir="rtl"] .hz-header .navbar-actions,
body[dir="rtl"] .hz-header .hz-actions {
    margin-left: 0 !important;
    margin-right: auto !important;
}
/* =========================================
   Final Header Layout by Language
========================================= */

/* =========================================
   Header Layout - EN normal / AR reversed
========================================= */

.hz-header .hz-inner {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    gap: 24px !important;
}

/* الأساس: English */
.hz-header .hz-logo {
    grid-column: 1 !important;
    justify-self: start !important;
}

.hz-header .hz-nav {
    grid-column: 2 !important;
    justify-self: center !important;
}

.hz-header .hz-actions {
    grid-column: 3 !important;
    justify-self: end !important;
}

/* العربي: اعكس الأماكن */
.hz-header .hz-inner.hz-layout-ar .hz-logo {
    grid-column: 3 !important;
    justify-self: end !important;
}

.hz-header .hz-inner.hz-layout-ar .hz-nav {
    grid-column: 2 !important;
    justify-self: center !important;
}

.hz-header .hz-inner.hz-layout-ar .hz-actions {
    grid-column: 1 !important;
    justify-self: start !important;
}

/* ترتيب القائمة */
.hz-header .hz-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 22px !important;
}

.hz-header .hz-menu,
.hz-header .hz-menu-account {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* اتجاه عناصر القائمة */
.hz-header .hz-inner.hz-layout-en .hz-nav {
    direction: ltr !important;
}

.hz-header .hz-inner.hz-layout-ar .hz-nav {
    direction: rtl !important;
}

/* الأزرار */
.hz-header .hz-actions {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* English: Login | English | Cart */
.hz-header .hz-inner.hz-layout-en .hz-login {
    order: 1 !important;
}

.hz-header .hz-inner.hz-layout-en .hz-lang-dropdown {
    order: 2 !important;
}

.hz-header .hz-inner.hz-layout-en .hz-cart {
    order: 3 !important;
}

/* Arabic: Cart | العربية | تسجيل الدخول */
.hz-header .hz-inner.hz-layout-ar .hz-cart {
    order: 1 !important;
}

.hz-header .hz-inner.hz-layout-ar .hz-lang-dropdown {
    order: 2 !important;
}

.hz-header .hz-inner.hz-layout-ar .hz-login {
    order: 3 !important;
}

/* Mobile */
@media (max-width: 1199px) {
    .hz-header .hz-inner {
        display: flex !important;
        justify-content: space-between !important;
    }
}
/* تحسين حجم عنوان قسم SSL */
.pro-ssl-header .pro-ssl-title,
.pro-ssl-section .pro-ssl-title {
    font-size: clamp(30px, 3vw, 42px) !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
}

/* تصغير الأيقونة داخل العنوان إن وجدت */
.pro-ssl-header .pro-ssl-title img,
.pro-ssl-header .pro-ssl-title i,
.pro-ssl-header .pro-ssl-title emoji {
    font-size: 32px !important;
    width: 32px !important;
    height: 32px !important;
}
/* إزالة bold من عنوان SSL */
.pro-ssl-section .pro-ssl-title,
.pro-ssl-header .pro-ssl-title {
    font-weight: 400 !important;
}
/* استهداف روابط Actions داخل standard_cart */
#order-standard_cart .sidebar-collapsed .panel.card.panel-default:nth-of-type(2) .panel-body a {
    font-size: 13px !important;
    line-height: 18px !important;
}

#order-standard_cart .sidebar-collapsed .panel.card.panel-default:nth-of-type(2) .panel-body a i,
#order-standard_cart .sidebar-collapsed .panel.card.panel-default:nth-of-type(2) .panel-body a svg {
    font-size: 13px !important;
    line-height: 18px !important;
    vertical-align: middle !important;
}
/* =====================================================
   HOSTING CARDS - REMOVE ICONS / USE CHECK / SHORTER CARDS
===================================================== */

/* الكرت نفسه أقصر */
#order-pure_comparison .price-table {
  min-height: auto !important;
  height: auto !important;
  padding-bottom: 0 !important;
}

/* تقليل ارتفاع الرأس */
#order-pure_comparison .top-head {
  padding: 20px 24px 10px !important;
}

/* تقليل المسافات داخل قائمة الميزات */
#order-pure_comparison .price-table > ul {
  padding: 8px 24px 6px !important;
  margin: 0 !important;
}

/* تنسيق كل سطر */
#order-pure_comparison .price-table > ul > li {
  position: relative !important;
  display: block !important;
  padding: 7px 0 7px 22px !important;
  margin: 0 !important;
  border-bottom: none !important;   /* إزالة الخطوط */
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: #4b5563 !important;
  text-align: left !important;
  min-height: auto !important;
}

/* إزالة الأيقونات الدائرية القديمة */
#order-pure_comparison .plan-smart-icon {
  display: none !important;
}

/* إزالة أي before/after قديم */
#order-pure_comparison .price-table > ul > li::after {
  display: none !important;
  content: none !important;
}

/* إضافة إشارة صح بدل الأيقونات */
#order-pure_comparison .price-table > ul > li::before {
  content: "✓" !important;
  position: absolute !important;
  left: 0 !important;
  top: 7px !important;
  color: #BB3030 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* تقليل المسافة قبل السعر */
#order-pure_comparison .price-area {
  padding: 14px 24px 20px !important;
}

/* تصغير السعر قليلًا */
#order-pure_comparison .price {
  margin-bottom: 10px !important;
}

#order-pure_comparison .price span,
#order-pure_comparison .price .js-price-text {
  font-size: 28px !important;
  font-weight: 800 !important;
}

#order-pure_comparison .price small,
#order-pure_comparison .price .js-price-suffix,
#order-pure_comparison .js-effective-monthly {
  font-size: 11px !important;
}

/* تصغير الزر قليلًا */
#order-pure_comparison .order-button {
  height: 40px !important;
  min-width: 170px !important;
  font-size: 13px !important;
  border-radius: 8px !important;
}

/* تصغير عنوان الباقة */
#order-pure_comparison .top-area h4 {
  font-size: 20px !important;
  margin: 0 !important;
}

/* RTL */
html[dir="rtl"] #order-pure_comparison .price-table > ul > li,
body.rtl #order-pure_comparison .price-table > ul > li {
  padding: 7px 22px 7px 0 !important;
  text-align: right !important;
}

html[dir="rtl"] #order-pure_comparison .price-table > ul > li::before,
body.rtl #order-pure_comparison .price-table > ul > li::before {
  left: auto !important;
  right: 0 !important;
}

/* للموبايل */
@media (max-width: 992px) {
  #order-pure_comparison .top-head {
    padding: 18px 20px 10px !important;
  }

  #order-pure_comparison .price-table > ul {
    padding: 8px 20px 6px !important;
  }

  #order-pure_comparison .price-area {
    padding: 12px 20px 18px !important;
  }
}
/* =====================================================
   HOSTING PLANS - CHECK MARKS + NO SEPARATORS
   ضع هذا الكود في آخر ملف CSS
===================================================== */

/* إزالة الخطوط بين الخيارات */
#order-pure_comparison .price-table > ul > li,
#order-pure_comparison .price-table > ul > li *,
#order-pure_comparison .price-table > ul li {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* إخفاء الأيقونات القديمة نهائياً */
#order-pure_comparison .plan-smart-icon,
#order-pure_comparison .plan-smart-icon i,
#order-pure_comparison .price-table > ul > li > i,
#order-pure_comparison .price-table > ul > li > span.plan-smart-icon {
    display: none !important;
}

/* تنسيق القائمة مثل الصورة الثانية */
#order-pure_comparison .price-table > ul {
    padding: 18px 34px 8px !important;
    margin: 0 !important;
    list-style: none !important;
}

/* كل خيار */
#order-pure_comparison .price-table > ul > li {
    position: relative !important;
    display: block !important;

    padding: 4px 0 4px 18px !important;
    margin: 0 0 8px !important;

    color: #334155 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    text-align: left !important;

    background: transparent !important;
    min-height: 0 !important;
}

/* إزالة أي رموز قديمة */
#order-pure_comparison .price-table > ul > li::after {
    display: none !important;
    content: none !important;
}

/* علامة الصح */
#order-pure_comparison .price-table > ul > li::before {
    content: "✓" !important;
    position: absolute !important;
    left: 0 !important;
    top: 4px !important;

    width: auto !important;
    height: auto !important;

    color: #BB3030 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;

    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;

    display: inline-block !important;
}

/* جعل الكروت أقصر */
#order-pure_comparison .price-table {
    min-height: auto !important;
    height: auto !important;
}

/* تقليل المسافة في رأس الكرت */
#order-pure_comparison .top-head {
    padding: 24px 30px 14px !important;
}

/* تقليل المسافة حول السعر والزر */
#order-pure_comparison .price-area {
    padding: 14px 30px 24px !important;
}

/* تصغير المسافة بين السعر والزر */
#order-pure_comparison .price {
    margin-bottom: 8px !important;
}

/* الزر */
#order-pure_comparison .order-button {
    height: 42px !important;
    max-width: 210px !important;
    border-radius: 8px !important;
}

/* دعم اللغة العربية */
html[dir="rtl"] #order-pure_comparison .price-table > ul > li,
body.rtl #order-pure_comparison .price-table > ul > li {
    padding: 4px 18px 4px 0 !important;
    text-align: right !important;
}

html[dir="rtl"] #order-pure_comparison .price-table > ul > li::before,
body.rtl #order-pure_comparison .price-table > ul > li::before {
    left: auto !important;
    right: 0 !important;
}
/* استبدال النجمة بتاج داخل شارة Most Popular */
#order-pure_comparison .popular-plan .txt-container::before {
    content: "\f521" !important;   /* Crown */
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    margin-inline-end: 7px !important;
    font-size: 11px !important;
    color: #fff !important;
}
/* =====================================================
   HOSTING PLANS - PRICE WEIGHT FIX
   السعر عادي / الإجمالي Bold
===================================================== */

/* السعر الكبير يكون عادي */
#order-pure_comparison .price,
#order-pure_comparison .price span,
#order-pure_comparison .price .js-price-text {
    font-weight: 400 !important;
}

/* كلمة / Month أيضاً عادية */
#order-pure_comparison .price small,
#order-pure_comparison .price .js-price-suffix {
    font-weight: 400 !important;
}

/* السعر الإجمالي في الأسفل يكون Bold */
#order-pure_comparison .js-effective-monthly,
#order-pure_comparison .price-area .js-effective-monthly,
#order-pure_comparison .price-area small,
#order-pure_comparison .price-area .setup-fee,
#order-pure_comparison .price-area .total-price {
    font-weight: 900 !important;
    color: #1F3A40 !important;
}
#order-pure_comparison .price-area > div:not(.price),
#order-pure_comparison .price-area > span:not(.price),
#order-pure_comparison .price-area > small:not(.js-price-suffix) {
    color: #000000 !important;
    font-weight: 900 !important;
    opacity: 1 !important;
}
/* =====================================================
   MOST POPULAR BADGE - TOP FLOATING ANIMATED
===================================================== */

/* مهم: السماح للشارة بالخروج فوق الكرت */
#order-pure_comparison .price-table {
    overflow: visible !important;
    position: relative !important;
}

/* رفع الشارة للأعلى مثل الصورة المرجعية */
#order-pure_comparison .popular-plan {
    position: absolute !important;
    top: -22px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    z-index: 30 !important;
    background: transparent !important;
}

/* شكل الشارة */
#order-pure_comparison .popular-plan .txt-container {
    min-width: 150px !important;
    height: 40px !important;
    padding: 0 20px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    background: #BB3030 !important;
    color: #ffffff !important;
    border-radius: 999px !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;

    box-shadow: 0 14px 30px rgba(187, 48, 48, 0.22) !important;

    animation: popularBadgeFloat 2.8s ease-in-out infinite !important;
}

/* تاج بدل النجمة */
#order-pure_comparison .popular-plan .txt-container::before {
    content: "\f521" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    font-size: 13px !important;
    margin: 0 !important;
}

/* حركة الشارة */
@keyframes popularBadgeFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}

/* إن كان Font Awesome لا يعرض التاج، استخدم تاج إيموجي */
#order-pure_comparison .popular-plan .txt-container.use-emoji-crown::before {
    content: "👑" !important;
    font-family: inherit !important;
}
/* ترك مساحة علوية داخل الكرت بعد رفع الشارة */
#order-pure_comparison .price-table-container > ul > li:first-child .top-head,
#order-pure_comparison .price-table.active .top-head {
    padding-top: 46px !important;
}
/* =====================================================
   HOSTING CARDS - ROUNDED EDGES LIKE REFERENCE
===================================================== */

/* حتى لا يتم قص شارة Most Popular */
#order-pure_comparison .price-table-container,
#order-pure_comparison .price-table-container > ul,
#order-pure_comparison .price-table-container > ul > li {
    overflow: visible !important;
}

/* شكل الكروت العام */
#order-pure_comparison .price-table {
    overflow: visible !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    border: 1px solid transparent !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.06) !important;
}

/* إزالة أي زوايا حادة من رأس الكرت */
#order-pure_comparison .top-head {
    border-radius: 24px 24px 0 0 !important;
    overflow: hidden !important;
    background: #ffffff !important;
}

/* الكرت المميز مثل الصورة الثانية */
#order-pure_comparison .price-table.active,
#order-pure_comparison .price-table-container > ul > li:first-child .price-table {
    border: 1.5px solid #BB3030 !important;
    border-radius: 24px !important;
    box-shadow: 0 22px 55px rgba(187, 48, 48, 0.08) !important;
}

/* حواف الشارة نفسها */
#order-pure_comparison .popular-plan .txt-container {
    border-radius: 999px !important;
    height: 40px !important;
    padding: 0 22px !important;
}

/* جعل الشارة نصفها فوق الكرت مثل المرجع */
#order-pure_comparison .popular-plan {
    top: -20px !important;
    z-index: 50 !important;
}

/* ترك مساحة بسيطة داخل الكرت تحت الشارة */
#order-pure_comparison .price-table-container > ul > li:first-child .top-head,
#order-pure_comparison .price-table.active .top-head {
    padding-top: 48px !important;
}

/* إلغاء أي حواف داخلية قديمة */
#order-pure_comparison .price-table::before,
#order-pure_comparison .price-table::after {
    display: none !important;
    content: none !important;
}
/* =====================================================
   FINAL FIX - MOST POPULAR BADGE LIKE REFERENCE
===================================================== */

/* السماح للشارة بالخروج من الكرت ومن رأس الكرت */
#order-pure_comparison .price-table-container,
#order-pure_comparison .price-table-container > ul,
#order-pure_comparison .price-table-container > ul > li,
#order-pure_comparison .price-table,
#order-pure_comparison .top-head,
#order-pure_comparison .top-area {
    overflow: visible !important;
}

/* الكرت يجب أن يكون مرجع لمكان الشارة */
#order-pure_comparison .price-table {
    position: relative !important;
    border-radius: 24px !important;
}

/* رأس الكرت بدون قص */
#order-pure_comparison .top-head {
    position: relative !important;
    z-index: 10 !important;
    border-radius: 24px 24px 0 0 !important;
    padding-top: 42px !important;
}

/* الشارة فوق حدود الكرت */
#order-pure_comparison .popular-plan {
    position: absolute !important;
    top: -22px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 999999 !important;
    background: transparent !important;
    width: auto !important;
    height: auto !important;
}

/* شكل الشارة مثل الصورة */
#order-pure_comparison .popular-plan .txt-container {
    height: 42px !important;
    min-width: 175px !important;
    padding: 0 24px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    background: #BB3030 !important;
    color: #ffffff !important;
    border-radius: 999px !important;

    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;

    box-shadow: 0 14px 28px rgba(187, 48, 48, 0.25) !important;
    animation: mostPopularFloatFinal 2.8s ease-in-out infinite !important;
}

/* تاج بدل النجمة */
#order-pure_comparison .popular-plan .txt-container::before {
    content: "\f521" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    font-size: 14px !important;
    color: #ffffff !important;
    margin: 0 !important;
}

/* إخفاء النجمة القديمة إن كانت موجودة */
#order-pure_comparison .popular-plan .txt-container i.fa-star,
#order-pure_comparison .popular-plan .txt-container .fa-star {
    display: none !important;
}

/* حركة خفيفة */
@keyframes mostPopularFloatFinal {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-4px);
    }
}

/* تقليل نزول العنوان */
#order-pure_comparison .price-table-container > ul > li:first-child .top-head,
#order-pure_comparison .price-table.active .top-head {
    padding-top: 38px !important;
}
/* =====================================================
   MOST POPULAR BADGE - ONE LINE + CORRECT POSITION
===================================================== */

#order-pure_comparison .price-table,
#order-pure_comparison .top-head,
#order-pure_comparison .top-area,
#order-pure_comparison .popular-plan {
    overflow: visible !important;
}

#order-pure_comparison .popular-plan {
    position: absolute !important;
    top: -21px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    z-index: 99999 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    min-width: max-content !important;
    background: transparent !important;
}

#order-pure_comparison .popular-plan .txt-container {
    width: auto !important;
    min-width: 220px !important;
    max-width: none !important;
    height: 42px !important;
    padding: 0 28px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow: visible !important;

    background: #BB3030 !important;
    color: #ffffff !important;
    border-radius: 999px !important;

    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;

    box-shadow: 0 14px 30px rgba(187,48,48,.25) !important;
    animation: mostPopularBadgeFloat 2.8s ease-in-out infinite !important;
}

#order-pure_comparison .popular-plan .txt-container::before {
    content: "\f521" !important;
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    font-size: 15px !important;
    color: #fff !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
}

@keyframes mostPopularBadgeFloat {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-4px);
    }
}

/* تقليل نزول العنوان داخل الكرت */
#order-pure_comparison .price-table-container > ul > li:first-child .top-head,
#order-pure_comparison .price-table.active .top-head {
    padding-top: 36px !important;
}

.iti__country-list,
.intl-tel-input .country-list {
    max-height: 80px !important;
}

.iti__country-list,
.intl-tel-input .country-list {
    max-height: 80px !important;
}

/* =====================================================
   FIX SSL PAGE BUTTON TEXT ALWAYS VISIBLE
===================================================== */

/* أزرار صفحة SSL */
.landing-page.ssl a.btn,
.landing-page.ssl .btn,
.landing-page.ssl .btn-primary,
.landing-page.ssl .btn-default,
.landing-page.ssl .validation-levels a,
.landing-page.ssl .validation-levels .btn,
.landing-page.ssl .content-block a.btn,
.landing-page.ssl .standout-1 a.btn {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-indent: 0 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    text-align: center !important;
    text-decoration: none !important;
}

/* إظهار النص داخل أي span داخل الزر */
.landing-page.ssl a.btn *,
.landing-page.ssl .btn *,
.landing-page.ssl .validation-levels a *,
.landing-page.ssl .content-block a.btn *,
.landing-page.ssl .standout-1 a.btn * {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* شكل الزر */
.landing-page.ssl a.btn,
.landing-page.ssl .validation-levels a.btn,
.landing-page.ssl .content-block a.btn,
.landing-page.ssl .standout-1 a.btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 74px !important;
    padding: 16px 30px !important;

    background: #BB3030 !important;
    border: none !important;
    border-radius: 18px !important;

    box-shadow: 0 22px 45px rgba(187, 48, 48, 0.24) !important;
}

/* عند الهوفر يبقى النص ظاهر */
.landing-page.ssl a.btn:hover,
.landing-page.ssl .btn:hover,
.landing-page.ssl .validation-levels a:hover,
.landing-page.ssl .content-block a.btn:hover,
.landing-page.ssl .standout-1 a.btn:hover {
    color: #ffffff !important;
    background: #9f1d22 !important;
    opacity: 1 !important;
}

/* إلغاء أي طبقة قد تخفي النص */
.landing-page.ssl a.btn::before,
.landing-page.ssl a.btn::after,
.landing-page.ssl .btn::before,
.landing-page.ssl .btn::after {
    pointer-events: none !important;
}

/* =====================================================
   FAQ AS SINGLE STATIC BOX LIKE SSL FAQ REFERENCE
   ضع هذا في آخر custom.css
===================================================== */

/* القسم */
.premium-faq-section {
    padding: 70px 20px !important;
    background: #F7F7F9 !important;
}

/* إخفاء العنوان القديم الكبير إذا أردت الشكل مثل الصورة تماماً */
.premium-faq-header {
    display: none !important;
}

/* الصندوق الرئيسي */
.premium-faq-list {
    max-width: 1180px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    gap: 0 !important;

    background: #ffffff !important;
    border: 1px solid rgba(31, 58, 64, 0.12) !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 34px rgba(31, 58, 64, 0.06) !important;

    overflow: hidden !important;
    display: block !important;
}

/* =====================================================
   FAQ FINAL CLEAN VERSION
   Uses real {$LANG.hp_section_title2} title
   Main arrow opens/closes all answers
===================================================== */

.premium-faq-section {
    padding: 70px 20px !important;
    background: #F7F7F9 !important;
}

/* Container */
.premium-faq-container {
    max-width: 1180px !important;
    margin: 0 auto !important;
}

/* Header الحقيقي المترجم */
.premium-faq-header {
    display: block !important;
    max-width: 1180px !important;
    margin: 0 auto !important;
    padding: 0 !important;

    background: #ffffff !important;
    border: 1px solid rgba(31,58,64,.13) !important;
    border-bottom: none !important;
    border-radius: 16px 16px 0 0 !important;

    box-shadow: 0 12px 34px rgba(31,58,64,.06) !important;
}

/* عنوان FAQ الحقيقي من ملف اللغة */
.premium-faq-header h2 {
    height: 64px !important;
    margin: 0 !important;
    padding: 0 28px 0 70px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    color: #1F3A40 !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-align: left !important;
}

/* إخفاء الزخرفة والوصف القديم */
.premium-faq-divider,
.premium-faq-header p {
    display: none !important;
}

/* صندوق الأسئلة */
.premium-faq-list {
    position: relative !important;

    max-width: 1180px !important;
    margin: 0 auto !important;

    background: #ffffff !important;
    border: 1px solid rgba(31,58,64,.13) !important;
    border-top: 1px solid rgba(31,58,64,.12) !important;
    border-radius: 0 0 16px 16px !important;

    box-shadow: 0 12px 34px rgba(31,58,64,.06) !important;

    display: block !important;
    overflow: visible !important;
}

/* إلغاء أي عنوان أو سهم وهمي من CSS */
.premium-faq-list::before,
.premium-faq-list::after {
    display: none !important;
    content: none !important;
}

/* زر السهم الرئيسي بجانب العنوان */
.faq-main-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    position: absolute !important;
    top: -52px !important;
    left: 28px !important;
    right: auto !important;

    width: 30px !important;
    height: 30px !important;

    border: 0 !important;
    border-radius: 10px !important;

    background: rgba(187,48,48,.08) !important;
    color: #BB3030 !important;

    cursor: pointer !important;
    z-index: 999999 !important;
    pointer-events: auto !important;

    transition: .25s ease !important;
}

/* شكل السهم */
.faq-main-toggle::before {
    content: "\f078" !important;
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", FontAwesome !important;
    font-weight: 900 !important;
    font-size: 13px !important;
    color: #BB3030 !important;
}

.faq-main-toggle:hover {
    background: rgba(187,48,48,.14) !important;
}

/* عندما تكون كل الإجابات مفتوحة */
.premium-faq-list.faq-all-open .faq-main-toggle {
    transform: rotate(180deg) !important;
}

/* إخفاء أيقونات وأسهم كل سؤال */
.premium-faq-icon,
.premium-faq-toggle,
.premium-faq-item summary::before,
.premium-faq-item summary::after {
    display: none !important;
    content: none !important;
}

/* كل سؤال */
.premium-faq-item {
    display: block !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    margin: 0 !important;
    padding: 0 36px !important;

    overflow: hidden !important;
    transform: none !important;
}

.premium-faq-item:hover {
    transform: none !important;
    box-shadow: none !important;
}

/* السؤال */
.premium-faq-item summary {
    display: block !important;
    grid-template-columns: none !important;

    cursor: pointer !important;
    list-style: none !important;

    padding: 26px 0 10px !important;
    border: none !important;

    color: #334155 !important;
}

.premium-faq-item summary::-webkit-details-marker {
    display: none !important;
}

.premium-faq-item summary::marker {
    content: "" !important;
}

/* نص السؤال */
.premium-faq-item summary strong {
    display: block !important;

    color: #334155 !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    line-height: 1.5 !important;
}

/* عند الفتح لا يتغير لون السؤال للأحمر */
.premium-faq-item[open] summary strong {
    color: #334155 !important;
}

/* الإجابة */
.premium-faq-answer {
    margin: 0 !important;
    padding: 0 0 24px !important;

    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;

    color: #64748b !important;
    font-size: 17px !important;
    font-weight: 500 !important;
    line-height: 1.9 !important;
}

.premium-faq-answer p {
    margin: 0 !important;
    color: #64748b !important;
}

/* آخر عنصر */
.premium-faq-item:last-child {
    padding-bottom: 26px !important;
}

/* Responsive */
@media (max-width: 768px) {
    .premium-faq-section {
        padding: 45px 12px !important;
    }

    .premium-faq-header h2 {
        height: 56px !important;
        padding: 0 20px 0 60px !important;
        font-size: 15px !important;
    }

    .faq-main-toggle {
        top: -43px !important;
        left: 20px !important;
    }

    .premium-faq-item {
        padding: 0 20px !important;
    }

    .premium-faq-item summary {
        padding: 22px 0 8px !important;
    }

    .premium-faq-item summary strong {
        font-size: 18px !important;
    }

    .premium-faq-answer {
        font-size: 15px !important;
        padding-bottom: 20px !important;
    }
}
/* =====================================================
   FAQ TOGGLE QUESTIONS + ANSWERS
===================================================== */

/* عند الإغلاق: إخفاء الأسئلة والأجوبة كاملة */
.premium-faq-list.faq-collapsed .premium-faq-item {
    display: none !important;
}

/* عند الفتح: إظهار الأسئلة */
.premium-faq-list:not(.faq-collapsed) .premium-faq-item {
    display: block !important;
}

/* عند الفتح: إظهار الإجابات */
.premium-faq-list:not(.faq-collapsed) .premium-faq-item[open] .premium-faq-answer {
    display: block !important;
}

/* عند الإغلاق: إخفاء الإجابات أيضًا */
.premium-faq-list.faq-collapsed .premium-faq-answer {
    display: none !important;
}

/* السهم للأسفل عند الإغلاق */
.premium-faq-list.faq-collapsed .faq-main-toggle {
    transform: rotate(0deg) !important;
}

/* السهم للأعلى عند الفتح */
.premium-faq-list.faq-all-open .faq-main-toggle {
    transform: rotate(180deg) !important;
}

/* حالة الصفحة العادية */
.contact-modern-grid {
    display: grid;
    grid-template-columns: minmax(280px, 380px) minmax(320px, 1fr);
    gap: 28px;
    align-items: stretch;
}

/* بعد الإرسال: البطاقة الحمراء تصبح في المنتصف */
.contact-modern-grid.contact-modern-grid-sent {
    display: flex !important;
    justify-content: center !important;
    align-items: stretch !important;
}

.contact-modern-grid.contact-modern-grid-sent .contact-info-panel {
    width: 100%;
    max-width: 430px;
    margin: 0 auto;
    animation: contactInfoMoveCenter 0.6s ease;
}

/* حركة ناعمة نحو المنتصف */
@keyframes contactInfoMoveCenter {
    from {
        opacity: 0.4;
        transform: translateX(-70px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* تحسين شكل رسالة النجاح */
.contact-modern-card .alert-success {
    border-radius: 10px !important;
    margin: 20px 0 24px !important;
    text-align: center !important;
}

/* موبايل */
@media (max-width: 767px) {
    .contact-modern-grid {
        grid-template-columns: 1fr;
    }

    .contact-modern-grid.contact-modern-grid-sent .contact-info-panel {
        max-width: 100%;
    }
}