.hero {
  background-image: url("../../img/Full-HD1920–2559.webp");
    background-position: top center;
    height: 700px !important;
  }
  /* NAV PILL */
.hero-nav-pill {
  background: rgba(255, 254, 254, 0.94);
  padding: 0.2rem 0.45rem;
 
 
  box-shadow: 0 15px 30px rgba(234, 231, 231, 0.18);
opacity: 1 !important;

  
}
  .hero-service-card{
    left: 80PX;
    /* انتقال به سمت راست برج */
    margin-right: 0;
    margin-left: 10px;  /* فاصله از برج (۱۰px) */
  }
 
 
  .hero-logo img{
    width: 80.00006103515625px;
    height: 16.1419734954834px;
    opacity: 1;
    left: 24px;
  }

  .Header-Line{
    width: 145.00001560745773;
    opacity: 1;
    top: 41.99px;
    left: 10px;
    border-width: 1px;
    margin-left: 60px;
  }

  .hero-btn-start{
    width: 134px;
    height: 48px;
    opacity: 1;
    top: 264px;
    left: 24px;
    border-radius: 20px;
    padding-top: 12px;
    padding-right: 20px;
    padding-bottom: 12px;
    padding-left: 20px;
    gap: 8px;
    /*text*/
    font-family: Avenir;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0px;
    text-align: center;
  }

  .hero-kicker{
    font-family: Avenir;
    font-weight: 400;
    font-style: Roman;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.8);
    line-height: 100%;
    letter-spacing: 0px;
  }

  .hero-title{
    font-family: Avenir;
    font-weight: 900;
    font-style: Black;
    font-size: 36px !important;
    line-height: 100%;
    letter-spacing: 0px;
  }

  .hero-subtitle{
    font-family: Avenir;
    font-weight: 400;
    font-style: Roman;
    font-size: 18px;
    line-height: 2rem !important;
    letter-spacing: 0px;
  }
  .hero-services-list{
  top: var(--services-top);
  right: var(--services-right);
  gap: 7px;
}
 
/*------------------------------------- Start Default value-------------------------------------------------*/
.hero-service-icon:nth-child(1){ --icon-x: var(--icon1-x); }
.hero-service-icon:nth-child(2){ --icon-x: var(--icon2-x); }
.hero-service-icon:nth-child(3){ --icon-x: var(--icon3-x); }
.hero-service-icon:nth-child(4){ --icon-x: var(--icon4-x); }
.hero-service-icon:nth-child(5){ --icon-x: var(--icon5-x); }
.hero-service-icon:nth-child(6){ --icon-x: var(--icon6-x); }
.hero-service-icon:nth-child(7){ --icon-x: var(--icon7-x); }

:root{
     /* hero services positioning */
    --services-top: 250px;
    --services-right: 273px;

    /* icon horizontal offsets */
    --icon1-x: 45px;
    --icon2-x: 28px;
    --icon3-x:18px;
    --icon4-x: 5px;
    --icon5-x: -5px;
    --icon6-x: -10px;
    --icon7-x: -15px;
  }
     .hero-header{margin-bottom: 10px !important;}
  /*------------------------------------- End Default value-------------------------------------------------*/
  /*=================================End Base =========================================*/
/*=================== START: Full HD | 1920–2559 ===================*/
/* Devices: Full HD (1920×1080) */

/*=================== START: Full HD Step | 1920–1924 ===================*/
@media (min-width: 1920px) and (max-width: 1924.98px){
  :root{ --services-top: 278px; --services-right: 160px; }
  .hero{ height: 945px !important;}
  
}
/*=================== END: Full HD Step | 1920–1924 ===================*/

/*=================== START: Full HD Step | 1925–1929 ===================*/
@media (min-width: 1925px) and (max-width: 1929.98px){
  :root{ --services-top: 709px; --services-right: 1362px; }
}
/*=================== END: Full HD Step | 1925–1929 ===================*/

/*=================== START: Full HD Step | 1930–1934 ===================*/
@media (min-width: 1930px) and (max-width: 1934.98px){
  :root{ --services-top: 710px; --services-right: 1366px; }
}
/*=================== END: Full HD Step | 1930–1934 ===================*/

/*=================== START: Full HD Step | 1935–1939 ===================*/
@media (min-width: 1935px) and (max-width: 1939.98px){
  :root{ --services-top: 711px; --services-right: 1370px; }
}
/*=================== END: Full HD Step | 1935–1939 ===================*/

/*=================== START: Full HD Step | 1940–1944 ===================*/
@media (min-width: 1940px) and (max-width: 1944.98px){
  :root{ --services-top: 712px; --services-right: 1374px; }
}
/*=================== END: Full HD Step | 1940–1944 ===================*/

/*=================== START: Full HD Step | 1945–1949 ===================*/
@media (min-width: 1945px) and (max-width: 1949.98px){
  :root{ --services-top: 713px; --services-right: 1378px; }
}
/*=================== END: Full HD Step | 1945–1949 ===================*/

/*=================== START: Full HD Step | 1950–1954 ===================*/
@media (min-width: 1950px) and (max-width: 1954.98px){
  :root{ --services-top: 714px; --services-right: 1382px; }
}
/*=================== END: Full HD Step | 1950–1954 ===================*/

/*=================== START: Full HD Step | 1955–1959 ===================*/
@media (min-width: 1955px) and (max-width: 1959.98px){
  :root{ --services-top: 715px; --services-right: 1386px; }
}
/*=================== END: Full HD Step | 1955–1959 ===================*/

/*=================== START: Full HD Step | 1960–1964 ===================*/
@media (min-width: 1960px) and (max-width: 1964.98px){
  :root{ --services-top: 716px; --services-right: 1390px; }
}
/*=================== END: Full HD Step | 1960–1964 ===================*/

/*=================== START: Full HD Step | 1965–1969 ===================*/
@media (min-width: 1965px) and (max-width: 1969.98px){
  :root{ --services-top: 717px; --services-right: 1394px; }
}
/*=================== END: Full HD Step | 1965–1969 ===================*/

/*=================== START: Full HD Step | 1970–1974 ===================*/
@media (min-width: 1970px) and (max-width: 1974.98px){
  :root{ --services-top: 718px; --services-right: 1398px; }
}
/*=================== END: Full HD Step | 1970–1974 ===================*/

/*=================== START: Full HD Step | 1975–1979 ===================*/
@media (min-width: 1975px) and (max-width: 1979.98px){
  :root{ --services-top: 719px; --services-right: 1402px; }
}
/*=================== END: Full HD Step | 1975–1979 ===================*/

/*=================== START: Full HD Step | 1980–1984 ===================*/
@media (min-width: 1980px) and (max-width: 1984.98px){
  :root{ --services-top: 720px; --services-right: 1406px; }
}
/*=================== END: Full HD Step | 1980–1984 ===================*/

/*=================== START: Full HD Step | 1985–1989 ===================*/
@media (min-width: 1985px) and (max-width: 1989.98px){
  :root{ --services-top: 721px; --services-right: 1410px; }
}
/*=================== END: Full HD Step | 1985–1989 ===================*/

/*=================== START: Full HD Step | 1990–1994 ===================*/
@media (min-width: 1990px) and (max-width: 1994.98px){
  :root{ --services-top: 722px; --services-right: 1414px; }
}
/*=================== END: Full HD Step | 1990–1994 ===================*/

/*=================== START: Full HD Step | 1995–1999 ===================*/
@media (min-width: 1995px) and (max-width: 1999.98px){
  :root{ --services-top: 723px; --services-right: 1418px; }
}
/*=================== END: Full HD Step | 1995–1999 ===================*/

/*=================== START: Full HD Step | 2000–2004 ===================*/
@media (min-width: 2000px) and (max-width: 2004.98px){
  :root{ --services-top: 724px; --services-right: 1422px; }
}
/*=================== END: Full HD Step | 2000–2004 ===================*/

/*=================== START: Full HD Step | 2005–2009 ===================*/
@media (min-width: 2005px) and (max-width: 2009.98px){
  :root{ --services-top: 725px; --services-right: 1426px; }
}
/*=================== END: Full HD Step | 2005–2009 ===================*/

/*=================== START: Full HD Step | 2010–2014 ===================*/
@media (min-width: 2010px) and (max-width: 2014.98px){
  :root{ --services-top: 726px; --services-right: 1430px; }
}
/*=================== END: Full HD Step | 2010–2014 ===================*/

/*=================== START: Full HD Step | 2015–2019 ===================*/
@media (min-width: 2015px) and (max-width: 2019.98px){
  :root{ --services-top: 727px; --services-right: 1434px; }
}
/*=================== END: Full HD Step | 2015–2019 ===================*/

/*=================== START: Full HD Step | 2020–2024 ===================*/
@media (min-width: 2020px) and (max-width: 2024.98px){
  :root{ --services-top: 728px; --services-right: 1438px; }
}
/*=================== END: Full HD Step | 2020–2024 ===================*/

/*=================== START: Full HD Step | 2025–2029 ===================*/
@media (min-width: 2025px) and (max-width: 2029.98px){
  :root{ --services-top: 729px; --services-right: 1442px; }
}
/*=================== END: Full HD Step | 2025–2029 ===================*/

/*=================== START: Full HD Step | 2030–2034 ===================*/
@media (min-width: 2030px) and (max-width: 2034.98px){
  :root{ --services-top: 730px; --services-right: 1446px; }
}
/*=================== END: Full HD Step | 2030–2034 ===================*/

/*=================== START: Full HD Step | 2035–2039 ===================*/
@media (min-width: 2035px) and (max-width: 2039.98px){
  :root{ --services-top: 731px; --services-right: 1450px; }
}
/*=================== END: Full HD Step | 2035–2039 ===================*/

/*=================== START: Full HD Step | 2040–2044 ===================*/
@media (min-width: 2040px) and (max-width: 2044.98px){
  :root{ --services-top: 732px; --services-right: 1454px; }
}
/*=================== END: Full HD Step | 2040–2044 ===================*/

/*=================== START: Full HD Step | 2045–2049 ===================*/
@media (min-width: 2045px) and (max-width: 2049.98px){
  :root{ --services-top: 733px; --services-right: 1458px; }
}
/*=================== END: Full HD Step | 2045–2049 ===================*/

/*=================== START: Full HD Step | 2050–2054 ===================*/
@media (min-width: 2050px) and (max-width: 2054.98px){
  :root{ --services-top: 734px; --services-right: 1462px; }
}
/*=================== END: Full HD Step | 2050–2054 ===================*/

/*=================== START: Full HD Step | 2055–2059 ===================*/
@media (min-width: 2055px) and (max-width: 2059.98px){
  :root{ --services-top: 735px; --services-right: 1466px; }
}
/*=================== END: Full HD Step | 2055–2059 ===================*/

/*=================== START: Full HD Step | 2060–2064 ===================*/
@media (min-width: 2060px) and (max-width: 2064.98px){
  :root{ --services-top: 736px; --services-right: 1470px; }
}
/*=================== END: Full HD Step | 2060–2064 ===================*/

/*=================== START: Full HD Step | 2065–2069 ===================*/
@media (min-width: 2065px) and (max-width: 2069.98px){
  :root{ --services-top: 737px; --services-right: 1474px; }
}
/*=================== END: Full HD Step | 2065–2069 ===================*/

/*=================== START: Full HD Step | 2070–2074 ===================*/
@media (min-width: 2070px) and (max-width: 2074.98px){
  :root{ --services-top: 738px; --services-right: 1478px; }
}
/*=================== END: Full HD Step | 2070–2074 ===================*/

/*=================== START: Full HD Step | 2075–2079 ===================*/
@media (min-width: 2075px) and (max-width: 2079.98px){
  :root{ --services-top: 739px; --services-right: 1482px; }
}
/*=================== END: Full HD Step | 2075–2079 ===================*/

/*=================== START: Full HD Step | 2080–2084 ===================*/
@media (min-width: 2080px) and (max-width: 2084.98px){
  :root{ --services-top: 740px; --services-right: 1486px; }
}
/*=================== END: Full HD Step | 2080–2084 ===================*/

/*=================== START: Full HD Step | 2085–2089 ===================*/
@media (min-width: 2085px) and (max-width: 2089.98px){
  :root{ --services-top: 741px; --services-right: 1490px; }
}
/*=================== END: Full HD Step | 2085–2089 ===================*/

/*=================== START: Full HD Step | 2090–2094 ===================*/
@media (min-width: 2090px) and (max-width: 2094.98px){
  :root{ --services-top: 742px; --services-right: 1494px; }
}
/*=================== END: Full HD Step | 2090–2094 ===================*/

/*=================== START: Full HD Step | 2095–2099 ===================*/
@media (min-width: 2095px) and (max-width: 2099.98px){
  :root{ --services-top: 743px; --services-right: 1498px; }
}
/*=================== END: Full HD Step | 2095–2099 ===================*/

/*=================== END: Full HD | 1920–2559 ===================*/