@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;600&display=swap');

a{text-decoration: none;color: inherit;}
::selection {
  color: rgb(0, 21, 255);
background: #0022ff32;
}
html{
  scroll-behavior: smooth;
}
  body{background-color: #ffffff;width: 100%;overflow-x: hidden;display: flex;flex-direction: column;justify-content: start;align-items: center;font-family: 'Manrope', sans-serif;margin: 0;position: relative;}





*{
    --white-metal:rgb(0, 0, 0);
    --white:#fff;
    --black:#1d1d1f;
    --menu-black:#181818;
    --text-secondary-light:#7d8387;
    --border:#80848d33;
    --border-bolder:#80848d6d;
    --grad: linear-gradient(30deg, #0f0091 50%, #00bbff);
    --grad90: linear-gradient(90deg, #0f0091 50%, #00bbff) ;
    --inversegrad: linear-gradient(-40deg, #0f0091 50%, #00bbff);
    --primary: #003cff;
    --dark-primary:#0028aa;
    --menu-grad:linear-gradient(120deg, #42a6f8 2%, #b9efff 4%, #84e2ff 50%, #42a6f8 54%);
    --menu-grad-90:linear-gradient(0deg, #42a6f8 2%, #b9efff 4%, #84e2ff 50%, #42a6f8 54%);
     --boxes-time: 400ms cubic-bezier(0.4, 0, 0.2, 1) 300ms;
     --bg3: #0043d389;
  }


::-webkit-scrollbar {
width: 4px;height: 4px;}
::-webkit-scrollbar-track {background:var(--white);}
::-webkit-scrollbar-thumb {transition: 0.7s;background: var(--black); border-radius: 100px;}
::-webkit-scrollbar-thumb:hover{background: #000000cc;}

.nav{color: var(--black);padding: 0px 5%;width: 90%;justify-content:space-between;display: flex;flex-direction: row;align-items: center;flex-wrap: nowrap;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;background-color: white;position: fixed;z-index: 99;left: 0%;top: 0;}
.nav::after{content: '';height: 100%;border-bottom:solid 1px var(--border);position: absolute;width: 90%;left: 5%;pointer-events: none;}
.nav:hover{background-color: var(--white);color: var(--black);}.nav:hover .logo img{filter: brightness(0);}
.nav:hover .btn-1{background: var(--grad);border-color: transparent;color: white;}
.nav:hover .btn-1.sm{background: transparent;border-color: black;color: black;}
.nav .btn-1.sm{overflow: hidden;margin: 0 -27px;padding:  15px 15px;transition: 0.7s ease-in-out;max-width: 40px;white-space: nowrap;display: flex;flex-direction: row;justify-content: end;align-items: center;flex-wrap: nowrap;}
.nav .btn-1.sm span{margin: 0 10px;}
.nav .btn-1.sm:hover{max-width: 800px;}
.nav .btn-1{padding:  15px 45px;}
.nav .logo img{width: 80px;filter: brightness(100%);transition: 0.2s ease-in-out;}
.nav .links{gap: 20px;display: flex;flex-direction: row;justify-content: center;align-items: center;color: inherit;}
.nav .nav-link{padding: 30px 1.4vw;color: inherit;gap: 10px;font-size: 14px;font-weight: 700;display: flex;flex-direction: row;justify-content: center;align-items: center;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;position: relative;}.nav .nav-link i{font-size: 10px;line-height: 0;margin-top: 3px;}
.nav .nav-link::after{width: 100%;background-color: transparent;border-radius: 10px;height:60%;position: absolute;content: '';top:17px;z-index: -1;left: 0;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
.nav .nav-link .main-link{color: inherit;gap: 5px;font-size: 14px;display: flex;flex-direction: row;justify-content: center;align-items: center;}
.nav .nav-link:hover{color: var(--primary);}
.nav .nav-link:hover::after{background-color: #00000007;}
.nav .nav-link.active{color: var(--primary);}
.nav .nav-link.active::after{background-color: #00000007;}
.nav .nav-link .droped{border-radius: 25px;color: white;width:80vw;padding: 80px 5vw;top: 100px;left: 5vw;background-color: var(--white-metal);box-shadow: rgba(0, 0, 0, 0.12)0px 4px 8px,rgba(0, 0, 0, 0.08) 0px 12px 24px;position: fixed;z-index: -1;display: none;justify-content: start;align-items: center;}
.nav .nav-link .droped::after{content: '';position: absolute;z-index: -1;left: 0;top: -30px;width: 100%;height: 100%;}
.nav .nav-link:hover .droped{display: flex;animation: slide-right 500ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
.nav .nav-link .droped .right{width:fit-content;height: fit-content;display: flex;flex-direction: row;justify-content: start;align-items: start;flex-wrap: wrap;gap:50px 2vw;}
.nav .nav-link .droped .right .col{width: 18vw;display: flex;flex-direction: row;justify-content: start;align-items: start;gap: 15px;}
.nav .nav-link .droped .right .col i{font-size: 20px;margin: 5px;position: relative;background-color: transparent;border: solid 1px white;padding: 10px;min-width: 25px;min-height: 25px;object-fit: contain;border-radius: 15px;transition: 0.2s ease-in-out;display: flex;justify-content: center;align-items: center;}
.nav .nav-link .droped .right .col:hover i{padding: 15px;margin: 0;background-color: var(--primary);color: var(--white);border-color: transparent;}
.nav .nav-link .droped .right .col .context{display: flex;flex-direction: column;justify-content: start;align-items: start;row-gap: 20px;padding-top:10px;}
.nav .nav-link .droped .right .col .context a{font-size: 20px;color: inherit;}
.nav .nav-link .droped .right .col .context .h2{font-size: 14px;margin: 0;font-weight: 400;color: var(--text-secondary-light);transition: 0.2s ease-in-out;}
.nav .nav-link .droped .right .col .context  span{font-size: 10px;background-color: rgba(128, 128, 128, 0.506);border-radius: 10px;padding: 2px 10px;line-height: 0;margin:0 4px ;}
.nav .nav-link .droped .right .col a.h2:hover{color: var(--primary);}
.nav .arrow-link{display: flex;flex-direction: row;justify-content: start;align-items: center;gap: 10px;color: inherit;font-size: 20px;}
.nav .icon{overflow: hidden;width: 40px;height: 40px;margin: 2.5px;border: solid 1px var(--border);border-radius: 1000px;transition: 0.2s ease-in-out;display: flex;flex-direction: column;justify-content: center;align-items: center;position: relative;}
.nav .nav-link .droped .right .col:hover .icon{ width: 45px;height: 45px;margin: 0px;background: var(--primary);}
.nav .icon svg{width: 15px;height: 15px;transition: 0.2s ease-in-out;position: absolute;}
.nav .icon .poped{bottom: -15px;left: -15px;}
.nav .nav-link .droped .right .col:hover .icon svg{transform: translateX(30px)translateY(-30px);}
.nav .arrow-link:hover .icon{width: 45px;height: 45px;margin: 0px;background: var(--primary);}
.nav .arrow-link:hover .icon svg{transform: translateX(30px)translateY(-30px);}
.nav .nav-link .droped .bottom{display: flex;flex-direction: column;justify-content: start;align-items: start;row-gap: 30px;}
.nav .nav-link .droped .bottom .imgs{display: flex;flex-direction: row;justify-content: start;align-items: start;flex-wrap: wrap;gap: 15px;row-gap: 20px;}
.nav .nav-link .droped .bottom .imgs img{height: 40px;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
.nav .nav-link .droped .bottom .imgs img:hover{transform: scale(110%);opacity: 0.8;}
.nav .nav-link .droped .bottom a{display: flex;flex-direction: row;justify-content: center;align-items: center;}
@keyframes slide-right{  0%{transform: translatex(20%);}100%{transform: translatex(0%);}}
@keyframes slide-left{  0%{transform: translatex(-50%);}100%{transform: translatex(0%);}}
.nav .other{color: inherit;display: flex;flex-direction: row;justify-content: center;align-items: center;gap: 20px;}
.nav .other .phone{color: inherit;font-size: 15px;font-weight: 700;line-height: 0px;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}.nav .other .phone:hover{text-decoration: underline var(--primary);color: var(--primary);}
.btn-1{box-shadow: inset 2px 2px 4px #ffffff50;padding: 15px 20px;border-radius: 20px;border: solid 1px var(--black);font-size: 13px;font-weight: 900;color: var(--black);background: #0518aa00;display: flex;flex-direction: row;justify-content: center;align-items: center;gap: 10px;transition: 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
.nav:hover .mburger svg{fill: var(--black);stroke: var(--black);}
.nav .mburger{display: none;}
.nav .mburger svg{width: 30px;height: 30px;fill: var(--black);stroke: var(--black);transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
.nav .menu{display: none;}
.hidden-button{display: none;}
/**/
@media screen and (max-width: 1000px){
  body{width: 100% !important;overflow-x: hidden !important;}
html{width: 100vw !important;overflow-x: hidden !important;}
    .nav{padding: 15px 5%;width: 89% !important;}
  .nav .mburger{display: flex;background: transparent;box-shadow: none;border: none;color: var(--white);;}
  .nav .links{display: none;}
  .nav .other .phone{display: none;}
  .btn-1{padding: 12px 20px !important;font-size: 11px;border-radius: 12px;}
.nav .btn-1.sm{margin: 0 -10px;padding:12px 10px !important;max-width: 40px ;white-space: nowrap;display: flex;flex-direction: row;justify-content: end;align-items: center;flex-wrap: nowrap;}
.nav .btn-1.sm:hover{max-width: 40px;}
  .nav .menu{width: 500px;max-width: 94%;right:-120vw ;height: 98%;padding-top: 0;padding-bottom: 0;background-color: black;display: flex;flex-direction: column;justify-content: space-between;align-items: center;position: fixed;top: 1%;color: var(--white);z-index: 100;transition:500ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;border-radius: 24px;}
  .nav .menu .top{width: 90%;display: flex;flex-direction: column;justify-content: start;align-items: start;}
  .nav .menu .top .header{margin-bottom: 15px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;width: 100%;padding-top: 20px;}
  .nav .menu .top .header img{width: 110px;filter: brightness(1000%);}
  .nav .menu .top .header .close{margin-bottom: 8px;width: 28px;height: 28px;padding: 20px;font-size: 20px;border-radius: 100%;background: #3e3e3e;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;border: none;color: var(--white);display: flex;align-items: center;justify-content: center;line-height: 0;font-weight: 100;}
  .nav .menu .top .row{height: 61px;width: 100%;font-size: 22px;font-weight: 600;border-bottom: solid 1px var(--border-bolder);display: flex;flex-direction: row;justify-content: space-between;align-items: center;}
  .nav .menu .top .row a{width: 80%;}
  .nav .menu .top .row:last-child {border-bottom: none;}
  .nav .menu .top .row i{font-size: 11px;width:40%;padding-inline-end: 5%;height: 100%;display: flex;align-items: center;justify-content: end;}
.hidden-button{position: fixed;width: 100%;height: 100%;top: 0;z-index: 20;left: 0vw;background-color: #000000ac;border: none;transition: 1s;}
  .nav .menu .bottom{width: 100%;display: flex;flex-direction: column;justify-content: end;align-items: center;gap: 20px;}
  .nav .menu .bottom .social{width: 90%;gap: 8px;display: flex;flex-direction: row;justify-content: start;align-items: center;}
  .nav .menu .bottom .social a{width: 38px;height: 38px;border-radius: 100%;border: solid 1px var(--primary);display: flex;align-items: center;justify-content: center;}
  
  .nav .menu .submenu{width: 95%; position: absolute;right: -100vw;height: 80%;top: 90px;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;background-color: black; display: flex;flex-direction: column;justify-content: start;align-items: start;}
   .nav .menu .submenu .submenu-header{margin-bottom: 10px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;width: 53%;font-size: 14px;}
   .nav .menu .submenu .submenu-header .back{font-size: 11px;height: 40px;gap: 13px;background-color: transparent;padding: 0 10px;color: var(--primary);font-weight: 900;display: flex;flex-direction: row;justify-content: start;align-items: center;border: none;}
   .nav .menu .submenu .submenu-header .back i{font-size: 15px;padding:0;margin: 0;}
   .nav .menu .submenu .submenu-row{font-size: 15px;height: 52px;display: flex;align-items: center;justify-content: start;width: 90%;line-height: 0;border-bottom: solid 1px var(--border-bolder);}
   .nav .menu .submenu .submenu-row:last-child {border-bottom: none;}
  }



  .group{display: flex;flex-direction: row;justify-content: center;align-items: center;gap: 14px;}
  .btn{cursor: pointer;;display: flex;flex-direction: row;justify-content: center;align-items: center;height: 55px;padding:0 30px;gap: 20px;border-radius: 20px;font-weight: 600;font-size: 14px;text-transform: uppercase;position: relative;border: none;}
  .btn img{height: 16px;}
  .filled{box-shadow: inset 1px 1px 1px #ffffff1c, inset  1px 1px 10px #00000033;transition: 0.5s ease-in-out;background: var(--grad90);color: white;}
  .width{transition: 400ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;margin-top: 50px;width: 60%;background-color: black;color: white;padding: 4px 0;height: 60px;border: none;font-weight: 600;}
  .filled.wide{width: 90%;}
  .width:hover{width: 80%;background-color: var(--primary);}
  .filled:hover{background:var(--inversegrad);}
  .lined{margin: 3px;background: var(--grad90);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
  .lined::before{min-width: 100%;width: fit-content;height: 100%;border-radius: inherit;content: '';background-color: #ffffff;position: absolute;left: 0;top: 0;z-index: -1;}
  .lined::after{min-width: 100%;width: 100%;transition: .3s ease-in-out;height: 100%;border-radius: 21px;content: '';position: absolute;z-index: -2;background: var(--grad90);left: -2px;top: -2px;padding: 2px;}
  .lined:hover::after{height: 0px;transform: translateY(0%) scaleX(80%);top: 100%}

  .bg1{height: 600px;width: 400px;background: var(--bg3);border-radius:100%;filter: blur(90px);inset-inline-start: -350px;z-index: -2;position: absolute;animation: slide-left 2s;opacity: 0.9;}
  .bg2{position: absolute;width: 80%;height: 50vw;inset-inline-end: -40%;z-index: -2;animation: slide-right 1.7s;opacity: 1;filter:brightness(190%)}
.hero{gap: 40px;height: 110vh;width: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;text-align: center;}
.hero h1{font-size:95px;width: 900px;letter-spacing: -2px;line-height: 100px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 0;}
/*.hero h1 span{background-image: url(./img/ul1.png);background-position: 0px 92%;background-size: 100% 20px;background-repeat: no-repeat;}*/
.hero p{line-height: 27px;font-size: 18px;width: 50%;max-width: 500px;font-weight: 600;margin: 0;color: var(--black);opacity: 0.8;}


.clock{opacity: 0.9;;background-color: rgb(255, 255, 255);margin-top: 40px;color: rgb(0, 0, 0);border-radius: 20px;display: flex;flex-direction: row;justify-content: center;align-items: center;height: 100px;position: relative;}
.clock::before{content: '';position: absolute;left: -2px;top: -2px;width: 100%;height: 100%;background: var(--grad90);border-radius: 21.5px;padding: 2px;z-index: -3;}
.clock::after{content: '';position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: white;border-radius: 20px;z-index: -2;}
.clock .box{padding: 0 30px;font-size: 13px;display: flex;flex-direction: column;justify-content: center;align-items: start;}
.clock .box:first-child{padding: 0 40px;}
.clock .box:last-child{padding: 0 40px;}
.clock .box small{font-size:35px;line-height: 52px;font-weight: 900;letter-spacing: -3px;}
.clock .last{border-radius: 20px;width: 100px;height: 100%;;background-size: 100%;background-position: center;background-repeat: no-repeat;}


.clock.wide{padding-inline-start: 5%;width: 85%;opacity: 1;background-color: #000000;margin: 0;color: black;border-radius: 20px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;height: 110px;position: relative;color: white;}
.clock.wide::before{display: none;}
.clock.wide::after{display: none;}
@media screen and (max-width: 1000px){
  .btn{height: 45px;padding:0 20px;gap: 20px;border-radius: 15px;font-weight: 600;font-size: 12px;}
  .group{gap: 10px;}
  .lined::after{border-radius: 18px;padding: 2px;}
  .bg1{height: 600px;width: 400px;background: var(--bg3);border-radius:100%;filter: blur(90px);inset-inline-start: -350px;z-index: -2;position: absolute;animation: slide-left 2s;opacity: 0.9;}
  .bg2{width: 70%;height: 70vw;inset-inline-end: -40%;margin-top: -520px;}
.hero{gap: 0px;height: 75vh;margin-top: 10vh;justify-content: center;align-items:start;text-align: start;width: 80%;}
.hero h1{font-size:60px;width: 450px;line-height: 65px;}
.hero p{margin-bottom: 50px;line-height: 20px;font-size: 14px;width: 100%;max-width: 500px;}

.clock{margin-top: 80px;border-radius: 20px;height: 80px;width: 100%;padding: 0 4%;margin-inline-start: -4%;}
.clock .box{padding: 0 10px;font-size: 12px;display: flex;flex-direction: column;justify-content: center;align-items: start;}
.clock .box:first-child{padding: 0 0px;}
.clock .box:last-child{padding: 0 0px;}
.clock .box small{font-size:20px;line-height: 25px;}
.clock .last{display: none;border-radius: 20px;width: 100px;height: 100%;;background-size: 100%;background-position: center;background-repeat: no-repeat;}
}
.section1{margin:13vh 0;margin-top: 0;gap: 4vw;height: fit-content;width:90%;display: flex;flex-direction: row;justify-content: start;align-items: center;text-align: start;position: relative;}
.section1 .img{width: 500px;height: 500px;border-radius: 30px;overflow: hidden;}
.section1 .img img{width: 100%;height: 100%;object-fit: cover; }
.section1 .context{row-gap: 50px;display: flex;flex-direction: column;justify-content: center;align-items: start;width: fit-content;}
.section1 h1{font-size:50px;width: 100%;letter-spacing: -2px;line-height: 50px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 0;}
.section1 p{line-height: 27px;font-size: 18px;width: 100%;max-width: 800px;font-weight: 600;margin: 0;color: var(--black);opacity: 0.8;}

.section1.black{border-radius: 25px;background-color: black;margin-top:13vh;margin-bottom: 20px;gap: 4vw;height: fit-content;width:85%;padding-inline-end: 5%;display: flex;flex-direction: row;justify-content: start;align-items: center;text-align: start;overflow: hidden;}
.section1.black .img{width: 500px;height: 550px;overflow: hidden;border-radius: 0px;}
.section1.black h1{font-size:50px;width: 100%;letter-spacing: -2px;line-height: 50px;  background:white;-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 0;}
.section1.black p{line-height: 27px;font-size: 15px;width: 100%;max-width: 800px;font-weight: 600;margin: 0;color: var(--white);opacity: 0.8;}
.section1.black .tags .tag{box-shadow: none;background: transparent;border: solid 1px white;}

.section1.single{padding: 120px 5%;width: 80%;margin-top: 20px;background-color: black;border-radius: 25px;}
.section1.single p{max-width: 80%;}
.section1 .iso{transition:500ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;inset-inline-end: -7vw;bottom: -7vw;width: 25vw;height: 25vw;position: absolute;border-radius: 100%;filter:grayscale(100%);mix-blend-mode:hard-light;opacity: .05;}
.section1 .iso img{width: 100%;height: 100%;object-fit: contain;}
.section1:hover .iso{transform: rotate(-45deg) scale(150%);}

@media screen and (max-width: 1000px){
  .section1{margin:1vh 0;margin-top: 0;margin-bottom: 10vh;gap: 4vw;height: fit-content;width:90%;display: flex;flex-direction: column;justify-content: start;align-items: center;text-align: start;position: relative;}
  .section1 .img{width: 100%;height: 300px !important;border-radius: 30px;overflow: hidden;margin-bottom: 20px;}
  .section1 .img img{width: 100%;height: 100%;object-fit: cover; }
  .section1 .context{row-gap: 20px;display: flex;flex-direction: column;justify-content: center;align-items: start;width: fit-content;}
  .section1 h1{font-size:30px;width: 100%;line-height: 35px;font-weight: 900; letter-spacing: -1px;}
  .section1 p{line-height: 22px;font-size: 14px;width: 100%;max-width: 400px;font-weight: 500;opacity:1;margin-bottom: 20px;}

  .section1.black{margin-top:120px;margin-bottom: 15px;gap: 4vw;padding-inline-end: 7%;padding-inline-start: 7%;width: 80%;flex-direction: column;padding-bottom: 80px;}
  .section1.black h1{font-size:34px;width: 100%;letter-spacing: -1px;line-height: 35px;}
  .section1.black p{line-height: 27px;font-size: 14px;width: 100%;max-width: 800px;font-weight: 300;opacity: 1;}
  .section1.single {margin-top:15px !important;}
  .section1.single p{max-width: 100%;}
.section1 .iso{width: 55vw;height: 55vw;}
.section1 .iso img{width: 100%;height: 100%;object-fit: contain;}


}

.tags{gap: 6px;width: 100%;display: flex;row-gap:10px ;color: white;flex-direction: row;flex-wrap: wrap;justify-content: start;align-items: start;}
.tags .tag{cursor: pointer;border-radius: 14px;box-shadow: inset 2px 2px 4px #ffffff50;padding: 0 20px;height: 35px;font-size: 13px;font-weight: 700;background: var(--grad);overflow: hidden;display: flex;flex-direction: column;justify-content: center;align-items: center;position: relative;font-family: 'IBM Plex Mono', monospace;}
.tags .tag:hover{background: var(--grad90);}
.tags .tag span{transition:400ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;line-height: 0;font-weight: inherit;text-transform: uppercase;}
.tags .tag span:last-child{position: absolute;bottom: -30px;}
.tags .tag:hover span{transform: translateY(-45px);}
@media screen and (max-width: 1000px){
  .tags{width: 90%;row-gap:10px;gap: 8px;}
 .tags .tag{padding: 0 10px;height: 24px;font-size: 11px;font-weight: 900;}
 .tags .tag:hover span{transform: translateY(-41px);}
}


.section7{margin:4vh 0;height: fit-content;width: 90%;overflow: hidden;flex-direction: column;justify-content: center;align-items: start;display: flex;}
.section7 .header{padding: 10px 0;padding-top: 0;display: flex;flex-direction: row;justify-content: space-between;align-items: start;align-items: center;width: 100%;}
.section7 .header h1{font-size:55px;width: fit-content;letter-spacing: -2px;line-height: 70px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 0;}
.section7 .wrapper{width: 100%;height: fit-content;overflow: hidden;margin-top: 50px;}
.section7 .wrapper .slider{cursor:default;gap: 1.5vw;width: fit-content;height: fit-content;display: flex;flex-direction: row;flex-wrap: nowrap;align-items: start;justify-content: start;}
.section7 .box:first-child{margin-inline-start: 4.5vw;}
.section7 .box:last-child{margin-inline-end: 4.5vw;}
.section7 .product{width: 25vw !important;min-width: 300px;max-width: 400px;}
.product{width: 24%;row-gap: 15px;display: flex;flex-direction: column;justify-content: start;align-items: start;}
.product .preview{cursor:default;width: 100%;height: 250px;border-radius: 25px;margin-bottom: 5px;overflow: hidden;position: relative;}
.product img{width: 100%;object-fit: cover;height: 100%;transition: transform 2s cubic-bezier(0.16, 1, 0.3, 1)}
.product:hover .preview img{transform: scale(125%);}
.product:hover .genre .tag{background-color: var(--primary);opacity: 1;}

.product .genre{display: flex;gap: 12px;width: 100%;justify-content: start;align-items: center;flex-direction: row;position: absolute;inset-inline-start: 10px;top: 10px;z-index: 2;}
.product .genre .tag{font-size: 13px;padding: 6px 15px;background-color: #00000082;color: white;display: flex;justify-content: center;align-items: center;border-radius: 1000px;text-transform: uppercase;font-family: 'IBM Plex Mono', monospace;font-weight: 700;transition: background-color 0.1s ease-in-out}
.product a{cursor:pointer;font-size:25px;width: 100%;letter-spacing: -1px;line-height: 36px;color: var(--black);margin: 0;font-weight: 600;}
 .stars{height: 18px !important;object-fit: contain !important;width: fit-content !important;}
.product .price{letter-spacing: -0.7px;margin: 20px 0;font-size:26px;color: var(--black);opacity: 1;display: flex;gap: 5px;width: 100%;justify-content: start;align-items: center;flex-direction: row;font-weight: 900;}
.product .price span{text-transform: uppercase;font-size: 17px;opacity: 0.7;}
@media screen and (max-width: 1000px){
    .section7 .header{padding: 0px 0;flex-direction: column;justify-content: start;align-items: start;align-items: start;gap: 14px;}
    .section7 .header h1{font-size:30px;width: 100%;line-height: 35px;font-weight: 900; letter-spacing: -1px;}
    .section7 .wrapper{margin-top: 30px;}
.product{width: 270px;row-gap: 19px;}
.product .preview{height: 150px;margin-bottom: 5px;}
.product .genre{gap: 8px;}
.product .genre .tag{font-size: 12px;padding: 5px 14px;}
.product .genre .date{font-size: 12px;}
.product a{font-size: 18px;letter-spacing: -0.5px;line-height: 25px;}}





.section2{margin: 13vh;gap: 25px;height: fit-content;width:90%;display: flex;flex-direction: column;justify-content: start;align-items: center;text-align: start;text-align: center;}
   .section2 h1{font-size:55px;width: 100%;letter-spacing: -2px;line-height: 70px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 0;}
   .section2 h2{line-height: 27px;font-size: 18px;width: 100%;max-width:900px;font-weight: 600;margin: 0;color: var(--black);opacity: 0.8;}
     .section2 .cards{margin-top: 30px;width: 100%;display: flex;flex-direction: row;justify-content: space-between;align-items: start;}
     .section2 .cards .card{row-gap: 20px;text-align: start;background-color: rgb(255, 255, 255);width: 32.5%;display: flex;flex-direction: column;justify-content: start;align-items: start;height: fit-content;}
     .section2 .cards .card .img{width: 100%;height: 400px;border-radius: 30px;overflow: hidden;position: relative;}
     .section2 .cards .card .img .preview{width: 100%;height: 100%;object-fit: cover; transition:400ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
     .section2 .cards .card .context{display: flex;flex-direction: row;justify-content: start;align-items: center;gap: 10px;width: 100%;}
  /*
     .section2 .cards .card .context .tm{box-shadow: 1px 1px 10px 1px #00000046;border-radius: 100%;display: flex;justify-content: center;align-items: center;height: 50px;width: 50px;background-color: white;overflow: hidden;}
     .section2 .cards .card .context .tm img{width: 100%;height: 100%;object-fit: contain;transform: scale(130%);}
   */ 
     .section2 .cards .card h3{width: 100%;;padding: 17px 20px;border-radius: 20px;background-color: black;color: white;font-size: 17px;letter-spacing: -0.1px;opacity: 1;margin: 0;font-weight: 600;}
     .section2 .cards .card:hover h3{background-color: var(--primary);}
     .section2 .cards .card .img .tags{position: absolute;inset-inline-start: 10px;top: 10px;z-index: 6;}
     .section2 .cards .card .img .tags .tag{background: rgba(0, 0, 0, 0.146);box-shadow: none;border: solid 1px white;}
     .section2 .cards .card:hover .preview{transform: scale(130%);filter: brightness(50%);} 
     .section2 .cards .card:hover .tags .tag{background: var(--primary);border-color:transparent;backdrop-filter: blur(20px);}
          .linkdot{cursor: pointer;backdrop-filter: blur(10px);padding: 7px;background-color: var(--primary);position: absolute;inset-inline-end: 10px;bottom: 10px;rotate: -45deg;font-size: 20px;max-width: 50px;max-height: 50px;min-width: 50px;min-height: 50px;display: flex;justify-content: center;align-items: center;border-radius: 100%;z-index: 2;transition:400ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;border: none;color: white;}
        .linkdot img{width: 18px;}
          .section2 .cards .card:hover .linkdot{rotate: 0deg;}
          .product:hover .linkdot{rotate: -45deg;}
          .product .linkdot{rotate: 0deg;}
          button.linkdot{padding: 35px;}
          .linkdot:active{transform: scale(120%);transition: 0s;}

          @media screen and (max-width: 1000px){
            .section2{margin: 13vh;gap: 25px;height: fit-content;width:90%;display: flex;flex-direction: column;justify-content: start;align-items: center;text-align: start;text-align: center;}
   .section2 h1{font-size:30px;width: 100%;letter-spacing: -1px;line-height: 40px;font-weight: 900;}
   .section2 h2{line-height: 20px;font-size: 13px;font-weight: 500;}
     .section2 .cards{margin-top: 30px;width: 100%;display: flex;flex-direction: column;justify-content: space-between;align-items: start;gap: 20px;}
     .section2 .cards .card{row-gap: 20px;text-align: start;background-color: rgb(255, 255, 255);width: 100%;display: flex;flex-direction: column;justify-content: start;align-items: start;height: fit-content;}
     .section2 .cards .card .img{width: 100%;height: 200px;border-radius: 30px;overflow: hidden;position: relative;}
     .section2 .cards .card .img .preview{width: 100%;height: 100%;object-fit: cover; transition:400ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
     .section2 .cards .card .context{display: flex;flex-direction: row;justify-content: start;align-items: center;gap: 10px;width: 100%;}
          }
          
.wider-banner{margin: 60px 0;border-radius: 30px;row-gap: 20px;padding: 70px 5%;width: 80%;display: flex;flex-direction: column;justify-content: center;align-items: start;background-color: black;color: white;position: relative;}
html[dir="rtl"] .wider-banner{background-position: 0% 100%;}

.wider-banner{background-position: 100% 0;background-repeat: no-repeat;background-size: 26%;}
.wider-banner h1{width: 50%;font-size: 67px;letter-spacing: -4px;line-height: 70px;margin: 0;font-weight: 900;}
.wider-banner p{font-size: 15px;width: 50%;margin: 0;min-width: 600px;line-height: 23px;margin-bottom: 22px;}
.wider-banner .btn-filled{width: 290px;}
@media screen and (max-width: 1000px){
  .wider-banner{width: 85%;padding: 35px 4%;row-gap: 8px;height: 350px;justify-content:start;padding-bottom: 0;background-position: 100% 100%;background-size: 45%;}
  html[dir="rtl"] .wider-banner{background-position: 0% 100%;}
  .wider-banner::after{width: 340px;height:180px;}
  .wider-banner h1{width: 93%;font-size: 30px;letter-spacing: -1px;line-height: 50px;}
.wider-banner p{font-size: 14px;width: 90%;min-width: 20px;line-height: 18px;margin-bottom: 30px;}
.wider-banner .btn-filled{width: 250px;}}
.section12{margin-top:200px;margin-bottom: 2vh;width: 90%;position: relative;display: flex;flex-direction: column;justify-content: center;align-items: center;text-align: center;}
.section12 .context{row-gap: 11px;display: flex;flex-direction: column;justify-content: center;align-items: center;width:100%;}
.section12 h1{font-size:95px;width: 100%;letter-spacing: -2px;line-height: 100px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 0;}
.section12 p{width: 50%;line-height: 27px;font-size: 18px;font-weight: 600;margin: 0;color: var(--black);opacity: 0.8;}
@media screen and (max-width: 1000px){
  .section12{margin-top:10vh;margin-bottom: 40px;width: 93%;position: relative;}
.section12 .context{row-gap: 11px;display: flex;flex-direction: column;justify-content: center;align-items: center;width:100%}
.section12 .context h1{font-size: 9vw;letter-spacing: -0.5vw;}
.section12 .context p{font-size:15px;max-width: 700px;line-height: 22px;letter-spacing: -0.2px;width: 90%;}}

.section15{transform: scale(90%);width: 100%;margin-bottom: 20vh;background-color: var(--black);height: 90vh;margin-top: 110px;position: relative;overflow: hidden;border-radius: 0px;border-radius: 25px;}
.section15 .list{position: absolute;width: max-content; height: 100%;left: 0;top: 0;display: flex; transition: 1s;}
.section15 .list .item{filter: brightness(80%);text-align: center;background-repeat: no-repeat;background-size: cover; width: 100vw; height: 100%; display: flex;flex-direction: column;justify-content: center;align-items: center;}
    .section15 .buttons{position: absolute;top: 0%;width: 100%;height: 100%;display: flex;justify-content: space-between;}
.section15 .buttons button{ background-color: transparent;width: 50%;height: 100%; color: #fff;border: none;}
.section15 .dots{ position: absolute;top: 30px;left: 0;color: #fff;width: 100%;margin: 0; padding: 0; display: flex;justify-content: center;}
.section15 .dots li{backdrop-filter: blur(20px);transition: 0.7s;list-style: none; width: 20%;height: 8px;background-color: #ffffff49;margin: 2px; border-radius: 20px;}
.section15 .dots li.active{width: 7%;background-color: white;}
/**/
#prev{cursor: url('../img/cursor/left.svg'),auto;}
#next{cursor: url('../img/cursor/right.svg'),auto;}

@media screen and (max-width: 1000px){
  .section15{width: 100%;background-color: var(--white);height: 350px;margin-top: 40px;}
  .section15 .list .item{filter: brightness(80%);background-size: 100%; width: 100vw;}
  .section15 .dots{top: 20px;}
  .section15 .dots li{ width: 25%;}
}



.filter{border-bottom:solid 1px var(--border);margin-top: 0px;margin-bottom: 50px;width: 90%;gap: 20px;padding: 40px 5%;display: flex;flex-wrap: wrap;flex-direction: row;justify-content: start;align-items: center;}
.filter .secondary-btn,.filter .all{font-size: 18px;transition: 0.2s ease-in-out;height: 45px;padding: 0 25px;background-color: white;border-radius: 15px;border: none;}
.filter .all{background-color: black;color: var(--white);margin-inline-end: 20px;position: relative;;}
.filter .all::before{z-index: 0;content: '';position: absolute;right: -20px;top: 0;width: 1px;height: 100%;background-color: var(--title);opacity: 0.6;}
.filter .secondary-btn:hover{background-color: var(--primary);color: var(--white);}

.dropdwn{position: relative;z-index: 2;}
 .dropdwn .dropbtn{position: relative;display: flex;flex-direction: row;line-height: 0;justify-content: center;align-items: center;gap: 10px;font-size: 18px;transition: 0.2s ease-in-out;height: 50px;padding: 0 25px;border: none;background-color: white;border-radius: 15px;background-color: black;color: var(--white);position: relative;}
 .dropdwn .dropbtn:hover{background-color: rgba(0, 0, 0, 0.888);}
 .dropdwn .dropbtn span{font-size: 22px;}
 .dropdwn .content{display: none;flex-direction: column;justify-content: center;width: 100%;align-items: center;position: absolute;top: 58px;border-radius: 20px;overflow: hidden;}
 .dropdwn .content .sub{text-align: center;text-decoration: none;transition: 0.2s ease-in-out;color: var(--white);background-color: black;width: 100%;font-size: 15px;padding: 15px 0;border: 0;border-bottom: solid 1px rgba(255, 255, 255, 0.292);}
 .dropdwn .content .sub:hover{background-color: rgba(0, 0, 0, 0.878);}
 .dropdwn .dropbtn:focus + .content{display: flex;}
 .dropdwn .content:hover{display: flex;}

 @media screen and (max-width: 1000px){
  .filter{margin-top: 0px;margin-bottom: 0px;gap: 5px;row-gap: 10px;padding-top: 20px;}
  .filter .secondary-btn,.filter .all{font-size: 14px;height: 45px;padding: 0 15px;}
  .dropdwn .dropbtn{gap: 0px;font-size: 14px;height: 40px;padding: 0 10px;}
  .dropdwn .dropbtn span{font-size: 20px;}
  .dropdwn .content{top: 48px;border-radius: 10px;}


}
.custom-select {position: relative;font-family: Arial;}
.custom-select select {display: none;}
.select-selected {border-radius: 15px;width: 170px;font-size: 15px;height: 25px;display: flex;justify-content: start;align-items: center;background-color: black;}
.select-selected:after {position: absolute;content: "";top: 20px;right: 25px;width: 0;height: 0;border: 6px solid transparent;border-color: #fff transparent transparent transparent;} 
.select-selected.select-arrow-active:after {border-color: transparent transparent #fff transparent;top: 7px;}
.select-items div,.select-selected {color: #ffffff;padding: 10px 16px;border: 1px solid transparent;border-color: transparent transparent rgba(255, 255, 255, 0.1) transparent;cursor: pointer;user-select: none;}
.select-items {position: absolute;background-color: black;border-radius: 10px;margin-top: 10px;top: 100%;left: 0;right: 0;z-index: 99;}     
.select-hide {display: none;}        
.select-items div:hover, .same-as-selected { background-color: rgba(192, 192, 192, 0.1);}

.section8{display: flex;flex-direction: column;justify-content: center;align-items: center;width: 90%;row-gap: 0px;margin: 50px 0;}
.section8 h1{width: 100%;text-align: start;font-size:55px;letter-spacing: -2px;line-height: 70px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 50px 0;}
.section8 .wrapper{transition:0ms;max-height: 430px;overflow: hidden;gap: 50px 1%;display: flex;flex-direction: row;justify-content: start;align-items: start;width: 100%;flex-wrap: wrap;}

@media screen and (max-width: 1000px){
  .section8{width: 90%;row-gap: 0px;margin: 20px 0;}
  .section8 h1{text-align: center;font-size:30px;letter-spacing: -1px;line-height: 35px;}
  .section8 .wrapper{max-height: 285px;gap: 50px 1%;}

  .section8 .product{width: 32%;row-gap: 8px;}
  .section8 .product .preview{width: 100%;height: 200px;border-radius: 25px;}
.section8 .product a{font-size:15px;letter-spacing: -1px;line-height: 26px;font-weight: 700;}
.section8  .stars{height: 12px !important;}
.section8 .product .price{margin: 0px 0;font-size:12px;gap: 5px;}
.section8 .product .price span{font-size: 12px;opacity: 0.7;}
}
.section8 .wrapper.expanded {
max-height: 100000px;
transition: max-height 4000ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}


.wideboxes{margin-top: 10vh;display: flex;flex-direction: column;justify-content: center;align-items: center;width:100%;text-align: center;}
.wideboxes .box{overflow: hidden;gap: 40px;transition:200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;position: relative;;border-top: solid 1px var(--border-bolder);height: 130px;width: 90%;padding: 0 5%;display: flex;flex-direction: row;justify-content: start;align-items: center;font-size:40px;letter-spacing: -2px;line-height: 0px;font-weight: 800;color: var(--black);} 
.wideboxes .box .icon{width: 50px;height: 50px;background-color: #ffffff;border-radius: 20px;overflow: hidden;padding: 20px;}
.wideboxes .box .icon img{width: 100%;height: 100%;object-fit: contain;}
.wideboxes .box::after{transition:400ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;z-index: -1;;content: '';position: absolute;left: 0;top: 0;height: 0;width: 100%;background-color: black;}
.wideboxes .box:hover::after{height: 100%;}
.wideboxes .box:hover{color: white;}
.wideboxes h1{font-size:95px;width: 90%;letter-spacing: -2px;line-height: 115px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin:11px 0;}
.wideboxes p{margin-bottom: 5vh;line-height: 27px;font-size: 18px;width: 50%;max-width: 500px;font-weight: 600;margin-top: 0;color: var(--black);opacity: 0.8;}
.wideboxes .box:first-of-type{border-top:none}
.wideboxes .last{font-size: 24px;line-height: 0px;letter-spacing: 7px;position: relative;;border-top: solid 1px var(--border-bolder);height: 130px;width: 90%;padding: 0 5%;display: flex;flex-direction: row;justify-content: start;align-items: center;color: var(--black);}

.servieces{width:90%;gap: 10px;}
.servieces .box{border-radius: 15px;background-color: rgba(0, 0, 0, 0.04);border-top:none;height: 100px;width: 90%;padding: 0 5%;display: flex;flex-direction: row;justify-content: start;align-items: center;font-size:40px;letter-spacing: -2px;line-height: 0px;font-weight: 800;color: rgb(0, 0, 0);} 
@media screen and (max-width: 1000px){
  .wideboxes{margin-top: 5vh;}
  .wideboxes .box{gap: 20px;font-size:20px;letter-spacing: -1px;width: 95%;height: 80px;} 
  .wideboxes .box .icon{width: 30px;height: 30px;border-radius: 10px;padding: 10px;}
  .wideboxes h1{font-size: 9vw;letter-spacing: -0.5vw;margin-bottom: 0;}
  .wideboxes p{margin-top: -20px;font-size:15px;max-width: 700px;line-height: 22px;letter-spacing: -0.2px;width: 90%;}
}


.bg3{height: 600px;width: 400px;background: var(--bg3);border-radius:100%;filter: blur(90px);bottom: 0;inset-inline-start: -400px;z-index: -2;position: absolute;opacity: 0.9;}

/* FOOTER */
.footer{border-top:solid 1px var(--border);color: var(--black);z-index: 3;margin: 0;margin:50px ;;height: fit-content;display: flex;flex-direction: column;justify-content: start;align-items: center;width: 90%;}
.footer .upper{padding: 90px 0;width: 90%;display: flex;flex-direction: row;justify-content: space-between;align-items: start;}
.footer .upper .left{display: flex;flex-direction: column;justify-content: start;align-items: start;row-gap: 45px;}
.footer .upper .left h1{width: 90%;font-size: 40px;margin: 0;letter-spacing: -2px;line-height: 50px;font-weight: 800; background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.footer .upper .left img{height: 50px;object-fit: contain;padding-bottom: 10px;padding-inline-start: 0px;padding-inline-end: 30%;}
.footer .upper .left h2{font-size: 14px;margin: 0;}
.footer .upper .right{gap: 150px;display: flex;flex-direction: row;justify-content: center;align-items: start;}
.footer .upper .right .group{row-gap: 5px;display: flex;flex-direction: column;justify-content: start;align-items: start;}
.footer .upper .right .group h1{margin-bottom: 8px;font-size: 30px;margin-top: 0;font-weight: 900; background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.footer .upper .right .group a{padding: 5px 0;text-transform:lowercase;font-size: 15px;text-decoration: none;opacity: 1;}
.footer .upper .right .group a:hover{opacity: 0.8;transform: scale(110%) translateX(5px);}
.footer .lower{width: 90%;padding-bottom: 30px;padding-top: 25px;border-top: solid 1px rgba(255, 255, 255, 0.31);display: flex;flex-direction: row;justify-content: space-between;align-items: start;}
.footer .lower p{font-size: 14px;font-weight: 100;}
.footer .lower .social{display: flex;flex-direction: row;justify-content: start;align-items: start;gap: 25px;}
.footer .lower .social a img{height: 20px;filter: invert(100%);}
.footer .lower .social a:hover{transform: scale(120%);}
.footer a{transition: 0.3s;}
/**/


@media screen and (max-width: 1000px){
    /* FOOTER */
.footer{margin: 2vw 0;width: 106.5%;padding-bottom: 30px;}
.footer .upper{padding: 60px 0;width: 80%;display: flex;flex-direction: column;justify-content: start;align-items: start;row-gap: 20px;}
.footer .upper .left{row-gap: 20px;margin-bottom: 0px;}
.footer .upper .left h1{font-size: 25px;}
.footer .upper .left img{height: 30px}
.footer .upper .left h2{font-size: 11px;}
.footer .upper .right{gap: 3vw;display: flex;flex-direction: column;justify-content: start;align-items: start;}
.footer .upper .right .group{margin-bottom: 10px;row-gap: 20px;display: flex;flex-direction: column;justify-content: start;align-items: start;}
.footer .upper .right .group h1{margin-top: 50px;margin-bottom: 8px;font-size: 22px;}
.footer .upper .right .group a{font-size: 14px;}
.footer .lower{padding-top: 25px;flex-direction: column-reverse;justify-content: center;align-items: center;}
.footer .lower p{font-size: 11px;text-align: center;margin: 20px 0;}

/**/
}

.product_page{margin-top: 150px;margin-bottom: 100px;display: flex;flex-direction: row;flex-wrap: wrap;justify-content: space-between;align-items: start;width: 90%;}


.product_page .right{width: 50%;padding-inline-start: 0%;display: flex;flex-direction: column;justify-content: start;align-items: start;row-gap: 40px;}
.product_page .right .brand{font-size: 13px;margin-top: 10px;display: flex;flex-direction: row;justify-content: start;align-items: center;gap: 8px;font-weight: 900;}
.product_page .right .brand img{width: 25px;height: 25px;padding:5px;object-fit: contain;object-position: center;border: solid 2px var(--primary);border-radius: 10px;}
.product_page .right .title{margin:0 ;gap:5px;display: flex;flex-direction: column;justify-content: start;align-items: start;}
.product_page .right .title h1{font-size: 25px;margin: 0;color: black;}
.product_page .right .title h2{font-size: 15px;;margin: 0;color: black;font-weight: 500;opacity: 0.7;margin-bottom: 20px}
.product_page .right .title img{width: 100px;margin: 0;}
.product_page .right .Grade{margin:0;font-size: 16px;color: black;font-weight: 600;}
.product_page .right .Grade span{font-size: 15px;margin: 0 10px;margin-inline-start: 0;}


.product_page .right .tab{row-gap: 15px;display: flex;flex-direction: column;justify-content: center;align-items: start;width: 100%;}
.product_page .right .tab h5{font-size: 15px;color: black;margin: 0px 0px;font-weight: 500;}
.product_page .right .tab .group{gap: 5px;display: flex;flex-direction: row;flex-wrap: wrap;justify-content: start;align-items: start;width: 90%;}
.product_page .right .tab .tablet{cursor: pointer;padding: 0 20px;height: 45px;border-radius: 10px;border: solid 1px rgba(0, 0, 0, 0.293);transition: 0.2s ease-in-out;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.product_page .right .tab .tablet img{width: 60px;height: 80%;object-fit: contain;}
.product_page .right .tab .tablet:hover{padding: 0 25px;}
.product_page .right .tab .tablet.black{color: white;background-color: black;}
.product_page .addtocart{margin-top: 30px;color: #000000;background-color: transparent;font-size: 20px;width: 40vw;height: 60px;transition: 0.2s ease-in-out;align-self: center;border-radius: 15px;border: solid 1px black}
.product_page .addtocart:hover{border: solid 1px transparent;background:var(--grad);color: white;}

.product_details{color: black;font-weight: 500;margin-bottom: 80px;width: 90%;display: flex;flex-direction: column;justify-content: start;align-items: start}
.product_details h6{margin: 0;font-size: 17px;background-color: black;border-radius: 10px;padding: 10px 22px;color: white;}
.product_details p{margin: 20px 0;font-size: 17px;opacity: 1;width: 80%;font-weight: 500;}

@media screen and (max-width: 1000px){ 
    
   .product_page .left{width: 100%;display: flex;flex-direction: column;justify-content: start;align-items: start;height: 600px;}
.product_page .right{width: 100%;padding-inline-start: 0%;display: flex;flex-direction: column;justify-content: start;align-items: start;row-gap: 50px;}

}



.sectionSlider{width: var(--containerwidth);--containerwidth:40vw;background-color: var(--black);height: 650px;position: relative;overflow: hidden;border-radius: 20px;}
.sectionSlider .list{position: absolute;width: max-content; height: 100%;left: 0;top: 0;display: flex; transition: 1s;}
.sectionSlider .list .item{position: relative;;text-align: center; width: var(--containerwidth); height: 100%; }
.sectionSlider .list .item .bg{width: 100%;height: 100%;object-fit: cover;}

.sectionSlider .navigatorbtns{background-color: transparent;width:20%;height: 100%; color: #fff;border: none;display: flex;flex-direction: column;justify-content: center;align-items: center;;position: absolute;top: 0%;}

.sectionSlider .navigatorbtns img{padding: 10px;border-radius: 100%;height: 30px;width: 30px;display: flex;justify-content: center;align-items: center;line-height: 0;transition: 0.3s ease-in-out;}
.sectionSlider .dots{ position: absolute;top: 10px;left: 10px;width: 100%;margin: 0; padding: 0; display: flex;justify-content: center;flex-direction: column;}
.sectionSlider .dots li{opacity: 0.8;background-size: cover;border: solid 3px transparent;;background-position: center;transition: 0.7s;list-style: none; width: 40px;padding: 0;;height:40px;margin: 5px; border-radius: 10px;}
.sectionSlider .dots li.active{border: solid 3px white;opacity: 1;}
/**/
.sectionSlider .prev{display: none;left: 0;padding-right: 10%;cursor: default;}.prev:hover img{margin-left: 5%;transform: scale(120%);}
.sectionSlider .next{display: none;right: 0;padding-left: 10%;cursor: default;}.next:hover img{margin-right: 5%;transform: scale(120%);}

@media screen and (max-width: 1000px){
  .sectionSlider{width: var(--containerwidth);--containerwidth:90vw;background-color: var(--black);height: 450px;margin-top: 0px;}


}



.greatbanner{margin-top: 90px;border-radius: 20px;overflow: hidden;;width: 86%;padding: 110px 3.5%;display: flex;flex-direction: column;justify-content: start;align-items: start;gap: 5px;position: relative;}
.greatbanner .bannerimg{position: absolute;left: 0;top: 0;width: 100%;height: 100%;object-fit: cover;z-index: -1;}
.greatbanner::before{z-index: 0;left: 0;top: 0;width: 100%;height: 100%;position: absolute;content: '';background-image: linear-gradient(170deg, #000000b8 20%, transparent 90%);}
.greatbanner .breadcrumbs{ z-index: 1;font-size: 14px;color: #ffffff9f;word-spacing: 4px;margin: 10px 0;font-weight: 500;}
.greatbanner .breadcrumbs span{color: white;}
.greatbanner .title{ z-index: 1;font-size: 60px;color: white;margin: 0;}
@media screen and (max-width: 1000px){
    .greatbanner{margin-top: 90px;padding: 60px 3.5%;gap: 0;}
    .greatbanner .title{ z-index: 1;font-size: 65px;color: white;margin: 0;}
}
    /* CART Page ////////////////////////////////////////////////////////////////////////////////////////*/

    .singleHeader{padding: 10px 0;margin-top: 140px;margin-bottom: 50px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;align-items: center;width: 100%;text-align: center;}
.singleHeader h1{font-size:55px;width: 100%;letter-spacing: -2px;line-height: 70px;  background:var(--grad);-webkit-background-clip: text;-webkit-text-fill-color: transparent;margin: 0;}
.singleHeader h1 span{font-size: 40px;font-weight: 900;}
.singleHeader h1 span::after{content: ")";}.singleHeader h1 span::before{content: "(";}
.cart{width: 90%;margin-bottom: 45px;display: flex;flex-direction: row;justify-content: space-between;align-items: start;flex-wrap: wrap;row-gap: 30px;}
.cart .items{padding: 2%;width: 45%;border-radius: 20px;display: flex;flex-direction: column;justify-content: center;align-items: center;border:  solid 1px #000000;transition: 0.2s ease-in-out;}
.cart .items .item:last-child {border-bottom: none;}
.cart .items .item{padding:30px 0;width: 100%;display: flex;flex-direction: row;align-items: center;justify-content: start;border-bottom: solid 1px #0000004a;transition: 0.2s ease-in-out;}
.cart .items h6{width: 100%;text-align: start;font-size: 25px;margin-top: 10px;margin-bottom: 15px;font-weight: 100;}
.cart .items .item .preview{width: 30%;height: 180px;object-fit: cover;border-radius: 15px;transition: 0.2s ease-in-out;pointer-events: none;}
.cart .items .item .info{margin: 0 3%;width: 47%;display: flex;flex-direction: column;justify-content: space-between;align-items: start;height: 80%;}
.cart .items .item .info h1{font-size: 23px;margin: 14px 0; margin-top: 0;width: 100%;}
.cart .items .item .info p{font-size: 18px;color: var(--link1);margin: 0;}
.cart .items .item .info .controlers{gap: 2%;margin-top: 20px;display: flex;flex-direction: row;justify-content: start;align-items: center;align-self: flex-end;width: 100%;transition: 0.2s ease-in-out;}
.cart .items .item .info .controlers .btn_2{gap: 8px;padding: 12px 22px;border-radius: 7px; background-color: transparent;color: #000;border: solid 1px #00000057;display: flex;flex-direction: row;justify-content: center;align-items: center;flex-wrap: nowrap;}
.cart .items .item .info .controlers .btn_2:focus{animation: click 0.4s ease-in-out;}
@keyframes click{  0%{transform: scale(110%);}100%{transform: scale(100%);}}
.cart .items .item .interaction{gap:40px;display: flex;flex-direction: column;justify-content: space-between;align-items: end;height: 80%;width: 30%;}
.cart .items .item .interaction .controlers{display: flex;flex-direction: column;justify-content: start;align-items: end;width: 200px;}
.cart .items .item .interaction .controlers .btns{display: flex;flex-direction: row;justify-content: center;align-items: center;width: 70%;height: 45px;border-radius: 11px;border: solid 1px #00000057;}
.cart .items .item .interaction .controlers .btns .control{height: 100%;width: 30%;background-color: transparent;border: none;font-size: 20px;transition: 0.2s ease-in-out;}
.cart .items .item .interaction .controlers .btns .control:focus{box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, 0.732);border-radius: 11px;}
.cart .items .item .interaction .controlers .btns .num{font-size: 17px;width: 75%;text-align: center;border: none;height: calc(100% - 2px);display: flex;justify-content: center;align-items: center;}
.cart .items .item .interaction .controlers .note{font-size: 14px;color: var(--title);font-weight: 100;opacity: 0.8;text-align: center;width: 70%;}
.cart .items .item .interaction .price{padding-top: 60px;font-size: 25px;margin: 0;font-weight: 900;}
.cart .items .item .interaction .price span{font-size: 18px;opacity: 0.5;font-weight: 500;}

.cart .total{background-color: black;position: sticky;top: 100px;padding: 3%;width: 25%;border-radius: 20px;display: flex;flex-direction: column;justify-content: center;align-items: center;border:  solid 1px #0000005e;transition: 0.2s ease-in-out;}
.cart .total .title{font-size: 25px;margin-bottom: 20px;color: white;}
.cart .total .half{padding: 20px 0;color: #ffffff;row-gap: 10px;border-bottom: solid 1px #ffffff3c;display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;align-items: center;width: 100%;}
.cart .total  .half .left{font-size: 14px;text-align: start;width: 50%;}
.cart .total  .half .right{font-size: 14px;text-align: end;width: 50%;}
.cart .total .half.bold{color: #ffffff;border: none;font-weight: 900;}

.cart .total .checked{ transition: 0.3s ease-in-out;margin-top: 30px;width: 100%;border-radius: 1000px;background-color: var(--red-grad);border: none;height: 45px;color: white;font-size: 20px;display: flex;flex-direction: column;justify-content: center;align-items: center;text-decoration: none;text-align: center;}
.cart .total .checked:hover{width: 80%;}

@media screen and (max-width: 1000px){ 
    .cart .total{box-shadow: 0 0 10px 2px #00000033;background-color: #ffffff;position: fixed;bottom: 0;left: 0;top: unset;padding:0 7.5%;padding-bottom: 5%;width: 85% !important;border: none;z-index: 6;height:fit-content !important;}
.cart .total .title{font-size: 16px;margin-bottom: 15px;color: rgb(0, 0, 0);font-weight: 700;padding-top: 15px;}
.cart .total .half{font-weight: 600;padding: 15px 0;color: #000000;row-gap: 4px;border-bottom: solid 1px #0000003c;display: flex;flex-direction: row;justify-content: space-between;flex-wrap: wrap;align-items: center;width: 100%;}
.cart .total  .half .left{font-size: 11px;text-align: start;width: 50%;}
.cart .total  .half .right{font-size: 11px;text-align: end;width: 50%;}
.cart .total .half.bold{color: #000000;border: none;font-weight: 900;margin-bottom: 5px;}

.cart .total .checked{ transition: 0.3s ease-in-out;margin-top: 30px;width: 100%;border-radius: 1000px;background-color: var(--red-grad);border: none;height: 45px;color: white;font-size: 20px;display: flex;flex-direction: column;justify-content: center;align-items: center;text-decoration: none;text-align: center;}
.cart .total .checked:hover{width: 80%;}
.cart .btn{width: 100%;}

    .singleHeader{margin-top: 80px;margin-bottom: 0;padding: 25px 0;flex-direction: column;justify-content: start;align-items: start;align-items: start;gap: 14px;}
    .singleHeader h1{font-size: 7vw ;letter-spacing: -0.20vw;width: 100%;}
    .singleHeader h1 span{font-size: 5vw;font-weight: 900;}
    .cart .items .item .preview{width: 30%;height: 78%;}
  .cart{flex-direction: column;align-items: center;margin-top: 0 ;}
  .cart .items h6{font-size: 18px;margin-top: 20px;margin-bottom: 20px;}
  .cart .items{width: 93%;border-radius: 15px;}
  .cart .total{width: 93%;border-radius: 15px;}
  .cart .items .item{height: 170px;width: 100%;}
  .cart .items .item .info{width: 60%;height: 80%;margin-inline-end: 0;}
  .cart .items .item .info h1{font-size: 15px;margin: 0px 0;margin-bottom: 10px;}
  .cart .items .item .info p{font-size: 11px;}
  .cart .items .item .info .controlers{margin-top: 10px;}
.cart .items .item .info .controlers .btn_2{padding: 10px 13px;font-size: 9px;}


.cart .items .item .interaction{height: 80%;width: 40%;}
.cart .items .item .interaction .controlers{width: 100%;}
.cart .items .item .interaction .controlers .btns{width: 100%;}
.cart .items .item .interaction .controlers .btns .control{height: 100%;width: 35%;font-size: 17px;}
.cart .items .item .interaction .controlers .btns .num{font-size: 15px;width: 30%;}
.cart .items .item .interaction .controlers .note{font-size: 10px;text-align: end;width: 100%;}
.cart .items .item .interaction .price{font-size: 20px;}
.cart .items .item .interaction .price span{font-size: 15px;}}


.formwrapperbig{width: 90%;padding: 0 2%;display: flex;flex-direction: row;justify-content: space-between;align-items: center;height: 100%;}
.formwrapperbig.cartsection .lilform{width: 100%;margin-top: 0;padding: 0;border:none!important}
.formwrapperbig.cartsection{margin-bottom: 100px;}
.lilform{padding: 20px;border: solid 1px black;border-radius: 25px;row-gap: 20px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;width: 51%;flex-wrap: wrap;}
.lilform .input{width: 49.2%;position: relative;}
.lilform .input input{width: 89%;padding: 0 5.5%;height: 45px;padding-top: 15px;border-radius: 15px;background-color: #31313112;outline: none;box-shadow: none;border: 0;border: solid 1px #7d838700;font-size: 18px;color: rgb(0, 0, 0);transition: 0.2s ease-in-out;position: relative;}
.lilform .input input:hover{background-color: #3333331e;border: solid 1px #9d9d9d00;}
.lilform .input input:focus{background-color: #33333300;border: solid 1px var(--primary);}
.lilform .input label{top: 32%;inset-inline-start: 5.5%;color: #7d8387;position: absolute;font-size: 15px;cursor: text;pointer-events: none;transition: 0.2s ease-in-out;}
.lilform .input input:focus + label,.lilform .input input.has-value + label{top: 11%;font-size: 12px;}
.lilform .message{width: 100%;}
.lilform .message input{width: 94%;padding-left: 3%;padding-right: 3%;}
.lilform .message label{inset-inline-start: 3%;}
.lilform .submit{height: 50px;margin-top: 20px;flex-direction: row;justify-content: space-between;align-items: start;display: flex;width: 100%;}
.lilform .submit .check{height: 100%;gap: 15px;position: relative;width: 50%;display: flex;flex-direction: row;justify-content: start;align-items: start;}
.lilform .submit .check label{color: #939a9e;font-size: 12px;pointer-events: all;line-height: 17px;}    .lilform .submit .check label a{color: var(--primary);}
.lilform .submit .check input{filter:saturate(0%) contrast(550%);;background-color: transparent;width: 30px;height: 20px;}
.lilform .submitbtn{cursor: pointer;width: 25%;height: 100%;border: solid 1px black;border-radius: 20px;color: rgb(0, 0, 0);font-size: 15px;font-weight: 700;display: flex;flex-direction: column;justify-content: center;align-items: center;transition: background-color 0.5s cubic-bezier(0.16, 1, 0.3, 1);position: relative;overflow: hidden;text-transform:uppercase;}
.lilform .submitbtn.wide{width: 100% !important;}
.lilform .submitbtn:hover{background:var(--grad);border: solid 1px transparent;color: white;}

 .radio{margin: 20px 0;gap: 6px;row-gap: 8px;height: fit-content;width: 100%;display: flex;flex-direction: row;flex-wrap: wrap;justify-content: start;align-items: start;}
 .radio p{font-size: 15px;opacity: 0.4;margin: 5px 0;width: 100%;}
 .radio label{background: rgba(0, 0, 0, 0.053);padding: 0px 14px;height: 34px;font-size: 13px;border-radius: 11px;;display: flex;align-items: center;justify-content: center;flex-direction: row; gap: 7px;text-transform: uppercase;transition: 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;font-weight: 800;}
 .radio label:hover{background:rgba(0, 0, 0, 0.03);}
 .radio input:nth-of-type(1):checked ~ label:nth-of-type(1){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(2):checked ~ label:nth-of-type(2){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(3):checked ~ label:nth-of-type(3){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(4):checked ~ label:nth-of-type(4){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(5):checked ~ label:nth-of-type(5){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(6):checked ~ label:nth-of-type(6){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(7):checked ~ label:nth-of-type(7){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(8):checked ~ label:nth-of-type(8){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(9):checked ~ label:nth-of-type(9){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(10):checked ~ label:nth-of-type(10){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(11):checked ~ label:nth-of-type(11){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(12):checked ~ label:nth-of-type(12){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(13):checked ~ label:nth-of-type(13){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(14):checked ~ label:nth-of-type(14){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(15):checked ~ label:nth-of-type(15){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(16):checked ~ label:nth-of-type(16){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(17):checked ~ label:nth-of-type(17){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(18):checked ~ label:nth-of-type(18){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(19):checked ~ label:nth-of-type(19){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(20):checked ~ label:nth-of-type(20){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(21):checked ~ label:nth-of-type(21){background:var(--grad);color: #ffffff;} .radio input:nth-of-type(22):checked ~ label:nth-of-type(22){background:var(--grad);color: #ffffff;}
.lilform .file{width:60%;cursor: pointer;}
.lilform .file label{cursor: pointer;gap: 14px;font-size: 13px;display: flex;flex-direction: row;justify-content: start;align-items: center;text-transform: uppercase;font-weight: 500;color: #000000;}
.lilform .file i{margin:3px;font-size: 12px;width: 40px;height: 40px;border-radius: 10px;border: solid 1px rgb(0, 0, 0);display: flex;justify-content: center;align-items: center;transition: 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;color: black;font-weight: 600;outline: none;}
.lilform .file:hover i{background: var(--grad);color: white;border:  solid 1px rgba(0, 0, 0, 0);}
@media screen and (max-width: 1000px){
    .lilform{row-gap: 1vh;flex-direction: column;justify-content: start;align-items: start;width: 95% !important;}
  .lilform .input{width: 100%;}
  .lilform .input input{width: 88%;padding: 0 6%;height: 30px;padding-top: 15px;font-size: 18px;}
  .lilform .input label{top: 28%;inset-inline-start: 6%;font-size: 14px;}
  .lilform .input input:focus + label,.lilform .input input.has-value + label{top: 12%;font-size: 10px;}
  .lilform .message{width: 100%;}
  .lilform .message input{width: 87%;padding-left: 6.5%;padding-right: 6.5%;}
  .lilform .message label{inset-inline-start: 6.5%;}
  .lilform .submit{height: 110px;margin-top: 20px;flex-direction: column;justify-content: start;align-items: start;display: flex;width: 100%;}
  .lilform .submit .check{height: 100%;gap: 15px;width: 95%;flex-direction: row;justify-content: start;align-items: start;}
  .lilform .submit .check label{font-size: 11px;}
  .lilform .submit .check input{width: 30px;height: 22px;}
  .lilform .submitbtn{width: 50%;height:90px;margin-top:0px;}
    
 .radio{gap: 6px;row-gap: 8px;}
.radio p{font-size: 14px;}
.radio label{padding: 0px 12px;height: 30px;font-size: 12px;}
.lilform .file{width:60%;margin-top: 1vh;}
.submit .check{margin-bottom: 2vh;width: 80%;}
.submit{margin-top: 1vh;}
.formwrapperbig{width: 92% !important;padding: 0 4%;display: flex;flex-direction: column-reverse;justify-content: center;align-items: center;height: 100%;gap: 50px;}
.contact{width: 100% !important;}
}

.contact{
    display: flex;flex-direction: column;justify-content: start;align-items: start;height: 100%;width: 45%;gap: 11px;
}
.contact .item{transition: 0.3s ease-in-out;padding: 4px 2%;width: 96%;background: rgba(36, 36, 36, 0.053);border-radius: 17px;display: flex;flex-direction: row;justify-content: start;align-items: center;gap: 10px;}
.contact .item:hover{background:rgba(0, 0, 0, 0);}
.contact .item:hover img{transform: scale(120%);filter: invert(100%);}
.contact .item img{transition: 0.3s ease-in-out;background-color: #000000;display: flex;flex-direction: row;justify-content: center;align-items: center;height: 30px;width: 30px;padding: 10px;border-radius: 10px;}
.contact .item p{font-size: 15px;font-weight: 600;color: #000000bd;gap: 1px;display: flex;flex-direction: column;justify-content: start;align-items: start;}
.contact .item p span{font-size: 18px;font-weight: 900;color: #000000;}