.frame {
  background-color: #ffffff;
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
}

.frame .div {
  background-color: #ffffff;
  overflow: hidden;
  width: 1441px;
  height: 4783px;
  position: relative;
}

.frame .KIV-l-s-g-s-INNOV-CI {
  position: absolute;
  top: 4491px;
  left: 205px;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 57.3px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .group {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 4995px;
  left: 205px;
}

.frame .overlap-group {
  position: relative;
  width: 254px;
  height: 65px;
  background-color: #df013a;
  border-radius: 12.28px;
}

.frame .text-wrapper {
  position: absolute;
  width: 209px;
  top: 20px;
  left: 25px;
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 21.4px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .overlap {
  position: absolute;
  width: 1440px;
  height: 368px;
  top: 4056px;
  left: 1px;
  background-image: url(./img/untitled-3-1.png);
  background-size: 100% 100%;
}

.frame .text-wrapper-2 {
  position: absolute;
  top: 148px;
  left: 432px;
  text-shadow: 8.18px 8.18px 16.37px #113448bf;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 57.3px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .overlap-2 {
  position: absolute;
  width: 1441px;
  height: 666px;
  top: 1159px;
  left: 0;
  background-image: url(./img/rectangle-29.png);
  background-size: cover;
  background-position: 50% 50%;
}

.frame .ellipse {
  position: absolute;
  width: 77px;
  height: 77px;
  top: 294px;
  left: 683px;
  background-color: #ffffffc4;
  border-radius: 38.62px;
}

.frame .polygon {
  position: absolute;
  width: 35px;
  height: 39px;
  top: 313px;
  left: 709px;
}

.frame .rectangle {
  position: absolute;
  width: 229px;
  height: 78px;
  top: 34px;
  left: 202px;
}

.frame .p {
  position: absolute;
  width: 266px;
  top: 4659px;
  left: 205px;
  transform: rotate(0.04deg);
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 20.5px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-3 {
  left: 202px;
  position: absolute;
  top: 2243px;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 57.3px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-4 {
  left: 561px;
  position: absolute;
  top: 2243px;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 57.3px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-5 {
  position: absolute;
  top: 2243px;
  left: 910px;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 57.3px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .overlap-wrapper {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 2493px;
  left: 202px;
}

.frame .div-wrapper {
  position: relative;
  width: 254px;
  height: 65px;
  background-color: #003790;
  border-radius: 12.28px;
}

.frame .overlap-group-wrapper {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 2493px;
  left: 561px;
}

.frame .group-2 {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 2493px;
  left: 910px;
}

.frame .text-wrapper-6 {
  top: 2353px;
  left: 202px;
  position: absolute;
  width: 266px;
  transform: rotate(0.04deg);
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 20.5px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-7 {
  top: 2353px;
  left: 561px;
  position: absolute;
  width: 266px;
  transform: rotate(0.04deg);
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 20.5px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-8 {
  top: 2353px;
  left: 918px;
  position: absolute;
  width: 266px;
  transform: rotate(0.04deg);
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 20.5px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .img {
  position: absolute;
  width: 487px;
  height: 286px;
  top: 4497px;
  left: 782px;
  object-fit: cover;
}

.frame .group-3 {
  position: absolute;
  width: 391px;
  height: 62px;
  top: 4905px;
  left: 832px;
}

.frame .rectangle-2 {
  position: absolute;
  width: 62px;
  height: 62px;
  top: -581px;
  left: -13753px;
}

.frame .rectangle-3 {
  position: absolute;
  width: 62px;
  height: 62px;
  top: -581px;
  left: -13671px;
}

.frame .rectangle-4 {
  position: absolute;
  width: 62px;
  height: 62px;
  top: -581px;
  left: -13588px;
}

.frame .rectangle-5 {
  position: absolute;
  width: 62px;
  height: 62px;
  top: -581px;
  left: -13506px;
}

.frame .rectangle-6 {
  position: absolute;
  width: 62px;
  height: 62px;
  top: -581px;
  left: -13424px;
}

.frame .overlap-3 {
  position: absolute;
  width: 1441px;
  height: 234px;
  top: 5131px;
  left: -4px;
  background-color: #000000;
}

.frame .text-wrapper-9 {
  position: absolute;
  width: 317px;
  top: 100px;
  left: 563px;
  font-family: "Inter", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 12.3px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.frame .overlap-4 {
  position: absolute;
  width: 1441px;
  height: 765px;
  top: 148px;
  left: 0;
}

.frame .overlap-5 {
  position: absolute;
  width: 1441px;
  height: 765px;
  top: 0;
  left: 0;
}

.frame .rectangle-7 {
  position: absolute;
  width: 1441px;
  height: 460px;
  top: 0;
  left: 0;
  background-color: #f5f5f5;
}

.frame .text-wrapper-10 {
  position: absolute;
  width: 631px;
  top: 45px;
  left: 373px;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 70.2px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .k-l-nleges-aj {
  position: absolute;
  width: 802px;
  top: 163px;
  left: 292px;
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 20.5px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.frame .rectangle-8 {
  position: absolute;
  width: 204px;
  height: 463px;
  top: 275px;
  left: 207px;
  object-fit: cover;
}

.frame .rectangle-9 {
  position: absolute;
  width: 210px;
  height: 471px;
  top: 254px;
  left: 616px;
  object-fit: cover;
}

.frame .rectangle-10 {
  position: absolute;
  width: 286px;
  height: 548px;
  top: 204px;
  left: 963px;
  object-fit: cover;
}

.frame .text-wrapper-11 {
  width: 136px;
  top: 738px;
  left: 1037px;
  font-size: 25.3px;
  white-space: nowrap;
  position: absolute;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-12 {
  position: absolute;
  width: 131px;
  top: 738px;
  left: 260px;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 25.3px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.frame .text-wrapper-13 {
  position: absolute;
  width: 116px;
  top: 738px;
  left: 663px;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 25.3px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.frame .group-4 {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 953px;
  left: 202px;
}

.frame .text-wrapper-14 {
  position: absolute;
  width: 209px;
  top: 20px;
  left: 23px;
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 21.4px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .group-5 {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 953px;
  left: 590px;
}

.frame .group-6 {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 953px;
  left: 979px;
}

.frame .rectangle-11 {
  position: absolute;
  width: 170px;
  height: 162px;
  top: 4586px;
  left: -13548px;
}

.frame .rectangle-12 {
  position: absolute;
  width: 229px;
  height: 154px;
  top: 4587px;
  left: -12742px;
  object-fit: cover;
}

.frame .rectangle-13 {
  position: absolute;
  width: 42px;
  height: 42px;
  top: 30px;
  left: 1140px;
  object-fit: cover;
}

.frame .rectangle-14 {
  position: absolute;
  width: 42px;
  height: 42px;
  top: 30px;
  left: 1194px;
  object-fit: cover;
}

.frame .element {
  position: absolute;
  width: 325px;
  height: 217px;
  top: 2003px;
  left: 562px;
  object-fit: cover;
}

.frame .element-2 {
  position: absolute;
  width: 329px;
  height: 219px;
  top: 2003px;
  left: 202px;
}

.frame .overlap-6 {
  position: absolute;
  width: 1441px;
  height: 344px;
  top: 2691px;
  left: 0;
  background-image: url(./img/rectangle-30.png);
  background-size: 100% 100%;
}

.frame .text-wrapper-15 {
  position: absolute;
  top: 136px;
  left: 450px;
  text-shadow: 8.18px 8.18px 16.37px #113448bf;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #ffffff;
  font-size: 57.3px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-16 {
  top: 3349px;
  left: 966px;
  position: absolute;
  width: 266px;
  transform: rotate(0.04deg);
  font-family: "SuzukiPRORegular-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 20.5px;
  letter-spacing: 0;
  line-height: normal;
}

.frame .group-7 {
  position: absolute;
  width: 256px;
  height: 65px;
  top: 3778px;
  left: 966px;
}

.frame .SUZUKI {
  top: 3181px;
  left: 967px;
  font-size: 57.3px;
  position: absolute;
  font-family: "SuzukiPROHeadline-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  letter-spacing: 0;
  line-height: normal;
}

.frame .rectangle-15 {
  position: absolute;
  width: 771px;
  height: 797px;
  top: 2586px;
  left: -13571px;
}

.frame .overlap-7 {
  position: absolute;
  width: 626px;
  height: 797px;
  top: 3167px;
  left: 182px;
}

.frame .rectangle-16 {
  position: absolute;
  width: 606px;
  height: 746px;
  top: 0;
  left: 21px;
}

.frame .rectangle-17 {
  position: absolute;
  width: 450px;
  height: 797px;
  top: 0;
  left: 0;
  object-fit: cover;
}

.frame .rectangle-18 {
  position: absolute;
  width: 330px;
  height: 219px;
  top: 1422px;
  left: -12847px;
}

.frame .overlap-8 {
  position: absolute;
  width: 327px;
  height: 219px;
  top: 2003px;
  left: 906px;
}

.frame .rectangle-19 {
  position: absolute;
  width: 327px;
  height: 218px;
  top: 1px;
  left: 0;
}

.frame .mask-group {
  position: absolute;
  width: 325px;
  height: 219px;
  top: 0;
  left: 0;
}

.frame .rectangle-20 {
  position: absolute;
  width: 1441px;
  height: 365px;
  top: 3477px;
  left: -13753px;
  object-fit: cover;
}
/* Existing styles */

/* Add comment to indicate where original CSS should be injected */
/* Original CSS starts here */

/* New and modified styles */
body {
  font-family: "SuzukiPRORegular-Regular", Helvetica, Arial, sans-serif;
  line-height: 1.6;
  color: #000000;
}

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
}

.logo {
  width: 229px;
  height: 78px;
}

nav a {
  margin-left: 10px;
}

.hero {
  background-color: #f5f5f5;
  padding: 40px 0;
  text-align: center;
}

h1,
h2 {
  font-family: "SuzukiPROHeadline-Regular", Helvetica, Arial, sans-serif;
    font-size: 57.3px;
}

.hero h1 {
  font-size: 70.2px;
  margin-bottom: 20px;
}

.product-showcase {
  display: flex;
  justify-content: space-around;
  margin-top: 40px;
}

.product-showcase article {
  text-align: center;
}

.cta-button {
  display: inline-block;
  background-color: #003790;
  color: #ffffff;
  padding: 15px 25px;
  border-radius: 12px;
  text-decoration: none;
  font-size: 21.4px;
  margin-top: 20px;
}

.cta-button:hover {
  background-color: #21375b; /* Sötétebb piros háttérszín egér fölé húzásra */
  color: #f0f0f0; /* Világosszürke szövegszín egér fölé húzásra */
  cursor: pointer; /* A kurzor megváltozik "mutatóvá", jelezve, hogy kattintható */
 transform: scale(1.1); /* Megnagyobbítja a képet 10%-kal (1-ről 1.1-re) */
}

.cta-button_red {
  display: inline-block;
  background-color: #cc0b0e;
  color: #ffffff;
  padding: 15px 25px;
  border-radius: 12px;
  text-decoration: none;
  font-size: 21.4px;
  margin-top: 20px;
}

.cta-button_red:hover {
  background-color: #003790; /* Sötétebb piros háttérszín egér fölé húzásra */
  color: #f0f0f0; /* Világosszürke szövegszín egér fölé húzásra */
  cursor: pointer; /* A kurzor megváltozik "mutatóvá", jelezve, hogy kattintható */
 transform: scale(1.1); /* Megnagyobbítja a képet 10%-kal (1-ről 1.1-re) */
}

.video-section {

  background-size: cover;
  background-position: center;
  height: 666px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.video-container {
  width: 77px;
  height: 77px;
  background-color: rgba(255, 255, 255, 0.77);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.play-icon {
  width: 0;
  height: 0;
  border-top: 20px solid transparent;
  border-left: 35px solid #000000;
  border-bottom: 20px solid transparent;
}

.catalog-section {
  display: flex;
  justify-content: space-around;
  padding: 40px 0;
}

.catalog-section article {
  width: 30%;
  text-align: center;
}

.feature-banner,
.feature-banner-2 {
  background-image: url(./img/background_v1.png);
  background-size: cover;
  background-position: center;
  height: 368px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.feature-banner h2,
.feature-banner-2 h2 {
  font-family: "SuzukiPRORegular", Helvetica, Arial, sans-serif;
  color: #ffffff;
  font-size: 50px;
  text-shadow: 8px 8px 16px rgba(17, 52, 72, 0.75);
}



.feature-banner,
.feature-banner-3 {
  background-image: url(./img/background_v3.png);
  background-size: cover;
  background-position: center;
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.feature-banner h2,
.feature-banner-3 h2 {
  font-family: "SuzukiPRORegular", Helvetica, Arial, sans-serif;
  color: #ffffff;
  font-size: 50px;
  text-shadow: 8px 8px 16px rgba(17, 52, 72, 0.75);
}



.product-highlight {
  display: flex;
  padding: 40px 0;
}

.product-images {
  width: 50%;
}

.product-info {
  width: 50%;
  padding: 0 40px;
}

.innovation-highlight {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 0;
  text-align: center;
}

.social-proof {
  display: flex;
  justify-content: center;
  padding: 40px 0;
}

.social-proof img {
  width: 62px;
  height: 62px;
  margin: 0 10px;
}

footer {
  background-color: #000000;
  color: #ffffff;
  text-align: center;
  padding: 20px 0;
  font-size: 12.3px;
}

@media (max-width: 768px) {
  .product-showcase,
  .catalog-section,
  .product-highlight {
    flex-direction: column;
    align-items: center;
  }

  .product-showcase article,
  .catalog-section article,
  .product-images,
  .product-info {
    width: 90%;
    margin-bottom: 20px;
  }
}

/* Az "article img" szabály a cikkekben lévő képekre vonatkozik */
article img {
    /* Ez a sor teszi simává az animációt 0.3 másodperc alatt */
    transition: transform 0.3s ease-out; 
}

/* Ez a szabály lép életbe, amikor a kép fölé viszed az egeret */
article img:hover {
    /* Ez a sor nagyítja meg a képet az eredeti méretének 105%-ára */
    transform: scale(1.05); 
}