.hero-section {
  display: flex;
  flex-direction: column;
  background-color: #080202;
  align-items: center;
  background-image: url("../img/Blur-red-bg.svg");
  background-repeat: no-repeat;
  background-position: 95% 70px;
  background-size: contain;
}
.inner-hero {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 40px;
  flex-wrap: wrap;
}
.inner-hero div h1 {
  color: #ffffff;
  font-family: "DM Sans", sans-serif;
  font-size: 72px;
  font-weight: 600;
}
.inner-hero div h1 span {
  color: #ca262b;
  font-size: 72px;
}
.inner-hero div span {
  color: #ca262b;
  font-family: "DM Sans", sans-serif;
  font-weight: 500;
  font-size: 24px;
}
.info-hero {
  padding-right: 100px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.hero-img {
  display: flex;
  justify-content: center;
}
.col-6 {
  width: 50%;
}

.marquee-container {
  padding: 80px 0;
  width: 100%;
  opacity: 0.5;
  overflow: hidden;
  position: relative;
}
.marquee {
  display: flex;
  width: max-content;
  gap: 40px;
}
.marquee img {
  width: 170px;
  height: auto;
  flex-shrink: 0;
}

.logo-scroller-container {
  padding: 100px 0;
  width: 100%;
  opacity: 0.5;
  overflow: hidden;
  position: relative;
}
.logo-scroller {
  display: flex;
  width: max-content;
  gap: 40px;
}
.logo-scroller img {
  width: 170px;
  height: auto;
  flex-shrink: 0;
}

.inner-support {
  display: flex;
  flex-direction: column;
  gap: 20px;
	background-color:black;
}

/* Full width form SAMO na Home */
/* home.css */
body.home .form-section {
  width: 100vw;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* support */
.support {
  background-color: #080202; 
  display: flex;
  justify-content: center;
}
.counter {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.counter-box h2 {
  font-family: "DM Sans", sans-serif;
  color: #ffffff;
  font-weight: 400;
  font-size: 72px;
  text-transform: uppercase;
}
.counter-box span {
  font-family: "DM Sans", sans-serif;
  color: #9c9999;
  font-weight: 400;
  font-size: 20px;
}

/* logo */
.logo-s {
  display: flex;
  justify-content: center;
  padding: 60px 0;
}

.bg-settings {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* services box */

.payment {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/ebcdcb58a27f73b22f95ca3ca5054e969da6b3fe.webp");
  display: flex;
  justify-content: center;
  padding: 110px 0;
  border-radius: 4px;
}
.one-in-three {
  display: flex;
  justify-content: center;        /* centriraj središte grupe */
  align-items: stretch;
  gap: 32px;                      /* razmak između kartica */
  flex-wrap: wrap;
  padding: 40px 0;
}
.reg {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/b920c9716db490543336144fd319b938cd183a00.webp");
  display: flex;
  justify-content: center;
  padding: 110px 0;
  border-radius: 4px;
}
.digi {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/b01c4f7b8152865460be069aabcd20029646b6d1.webp");
  display: flex;
  justify-content: center;
  padding: 110px 0;
  border-radius: 4px;
}
.res {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/fb4224935d61e65df7fa55bd369aae6ed22d6339.webp");
  display: flex;
  justify-content: center;
  padding: 110px 100px;
  border-radius: 4px;
}
.text-box {
  text-align: center;
}
.text-box h2 {
  font-family: "DM Sans", sans-serif;
  color: #ffffff;
  font-weight: 400;
  font-size: 64px;
}
.text-box span {
  font-family: "DM Sans", sans-serif;
  color: #cfcecd;
  font-weight: 400;
  font-size: 20px;
}
.text-box-2 {
  text-align: center;
}
.text-box-2 h2 {
  font-family: "DM Sans", sans-serif;
  color: #ffffff;
  font-weight: 400;
  font-size: 48px;
}
.text-box-2 span {
  font-family: "DM Sans", sans-serif;
  color: #cfcecd;
  font-weight: 400;
  font-size: 20px;
}
.one-in-four {
  display: flex;
  justify-content: space-between; /* ravnomerno razmakni */
  gap: 15px;                       /* razmak između kartica */
  flex-wrap: nowrap;               /* sve u jednom redu */
  align-items: stretch;            /* iste visine */
  padding: 5px 0;
  box-sizing: border-box;
}

.one-in-four a {
  flex: 1 1 25%;       /* svaka kartica 25% širine */
  text-decoration: none;
}

.four-card {
  height: 100%;        /* kartica popunjava visinu */
  display: flex;
  align-items: flex-end; /* tekst u donjem delu */
  background-size: cover;
  background-position: center;
  overflow: hidden;
}

.pickup {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/6ff9b9d4cda8ba456173442f603d116a790e963c.webp");
  display: flex;
  padding: 290px 130px 30px 30px;
  border-radius: 4px;
}
.digi-sin {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/f406fcf0f0a886266cd86cb1da6af80c2a1a75d6.webp");
  display: flex;
  padding: 290px 130px 30px 30px;
  border-radius: 4px;
}
.inventory {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/80eedd310c204f9246daab039cfa5dd2cf336797.webp");
  display: flex;
  padding: 290px 130px 30px 30px;
  border-radius: 4px;
}
.review {
  background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("../img/9fdbb25b74eecdc1a9a46a0bfc83e53a15e883d8.webp");
  display: flex;
  padding: 290px 130px 30px 30px;
  border-radius: 4px;
}
.text-box-3 h2 {
  font-family: "DM Sans", sans-serif;
  color: #ffffff;
  font-weight: 400;
  font-size: 48px;
}
.text-box-3 span {
  font-family: "DM Sans", sans-serif;
  color: #cfcecd;
  font-weight: 400;
  font-size: 20px;
}

/* information section */
.information {
  padding: 100px 0;
  display: flex;
  justify-content: center;
  background-color: #080202;
  background-image: url("../img//bg-2.svg");
  background-position: 70px 240px;
  background-repeat: no-repeat;
}
.inner-info {
  display: flex;
  flex-direction: column;
  gap: 160px;
}
.dual-card {
  display: flex;
  flex-wrap: wrap;
}
.left-container-box {
  width: 50%;
  display: flex;
  flex-direction: column;
  /* gap: 30px; */
  justify-content: center;
}
.left-container-box h2 {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 64px;
  color: #ffffff;
  line-height: 70px;
}
.left-container-box h2 span {
  font-size: 64px;
  color: #ca262b;
}
.left-container-box p {
  font-family: "DM Sans", sans-serif;
  font-weight: 500;
  font-size: 20px;
  color: #9c9999;
  padding: 20px 0 50px 0;
}
.right-container-box {
  width: 50%;
  display: flex;
  justify-content: end;
}
.right-container-box-inv {
  width: 50%;
  display: flex;
  justify-content: start;
}

/* services */
.ben-services {
  background-color: #080202;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 80px 0 100px 0;
}
.inner-ben-sev {
  display: flex;
  flex-direction: column;
  gap: 80px;
  align-items: center;
}
.inner-ben-sev h2 {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 64px;
  color: #ffffff;
}
.inner-ben-sev span {
  font-family: "DM Sans", sans-serif;
  font-weight: 500;
  font-size: 20px;
  color: #ca262b;
}

.ser-icon-card {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.icon-box {
  width: 24%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.icon-box svg {
  width: 60px;
  height: 60px;
}
.icon-box h3 {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 24px;
  color: #ffffff;
}
.icon-box p {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 18px;
  text-align: center;
  color: #9c9999;
}

.text-center {
  text-align: center;
  width: 90%;
}

.testmoni-warp,
.news-card-warp {
  max-width: 100%;
  overflow: auto;
}

.testmoni-card {
  display: flex;
  gap: 20px;
}

.testmoni-box {
  background-color: #fefefe1a;
  backdrop-filter: blur(50px);
  border: 1px solid #747171;
  border-radius: 4px;
  width: 400px;
  padding: 25px;
  gap: 20px;
  display: flex;
  flex-direction: column;
}
.rate {
  display: flex;
  justify-content: space-between;
}
.testmoni-text {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.testmoni-text h4 {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #fefefe;
}
.testmoni-text span {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #ca262b;
}
.testmoni-text p {
  font-family: "DM Sans", sans-serif;
  font-weight: 300;
  font-size: 16px;
  color: #a5a3a3;
}

/* latest news */
.inner-new-container {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
}
.lates-news {
  display: flex;
  justify-content: center;
  padding: 100px 0;
}
.text-black {
  width: 100%;
}
.text-black h2 {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 64px;
  color: white;
}
.news-card {
  display: flex;
  gap: 20px;
}
.news-box {
  width: 400px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.news-box img {
  width: 100%;
  height: 250px;
  object-fit: cover;
  border-radius: 4px;
}
.news-box span {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 14px;
  text-transform: uppercase;
  color: #ca262b;
}
.news-box h3 {
  font-family: "DM Sans", sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: white;
}
.news-box p {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #6a6767;
}
.read-more {
  cursor: pointer;
  color: #666666;
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
  font-size: 16px;
  border: none;
  background-color: transparent;
  display: flex;
  gap: 10px;
  transition: all 0.3s ease;
  align-items: center;
}
.read-more:hover {
  transition: all 0.3s ease;
  transform: scale(1.1);
}

@media (max-width: 768px) {
  .one-in-three,
  .one-in-four {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }
  .one-in-four {
    grid-template-columns: none !important;
    padding: 20px 0 !important;
	  justify-content:center !important;
	  align-content:center !important;
  }
  .reg, .digi, .res {
    padding: 60px 20px !important;
  }
}
