/* screen - homepage */

.homepage {
  background-color: var(--white);
  height: 5502px;
  overflow: hidden;
  position: relative;
  width: 1512px;
}

.homepage .system-icons {
  height: 32px;
  position: relative;
  width: 32px;
}

.homepage .training-awareness {
  align-self: stretch;
  color: var(--turquoise-blue);
  font-weight: 600;
  line-height: 36px;
  position: relative;
  text-align: center;
}

.homepage .frame-3 {
  align-items: center;
  border: 1px solid;
  border-color: var(--ebony-clay);
  border-radius: 4px;
  display: flex;
  gap: 22px;
  overflow: hidden;
  padding: 20px;
  position: relative;
  width: 437px;
}

.homepage .group {
  height: 48px;
  position: relative;
  width: 48px;
}

.homepage .manufacturing-industry-40-security {
  color: var(--ebony-clay);
  font-weight: 600;
  line-height: 36px;
  margin-top: -1.00px;
  position: relative;
  width: 356.52px;
}

.homepage .clip-path-group {
  height: 878px;
  left: -7880px;
  position: absolute;
  top: 3230px;
  width: 1755px;
}

.homepage .objects {
  height: 1036px;
  left: 776px;
  position: absolute;
  top: 851px;
  width: 736px;
}

.homepage .objects-1 {
  height: 1036px;
  left: 0;
  position: absolute;
  top: 851px;
  width: 437px;
}

.homepage .group-11 {
  display: flex;
  height: 112px;
  left: 677px;
  position: absolute;
  top: 1003px;
  width: 714px;
}

.homepage .group-13 {
  display: flex;
  height: 56px;
  left: 210px;
  position: absolute;
  top: 577px;
  width: 506px;
}

.homepage .group-10 {
  height: 335px;
  left: 100px;
  position: absolute;
  top: 195px;
  width: 41px;
}

.homepage .rectangle-14 {
  background-color: var(--cape-cod);
  height: 335px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1px;
}

.homepage .rectangle-16 {
  background-color: var(--cape-cod);
  height: 1px;
  left: 1px;
  position: absolute;
  top: 334px;
  width: 40px;
}

.homepage .frame-424 {
  align-items: flex-start;
  align-self: stretch;
  display: flex;
  flex: 0 0 auto;
  gap: 14px;
  position: relative;
  width: 100%;
}

.homepage .system-icons-1 {
  height: 24px;
  margin-bottom: -4.00px;
  margin-left: -4.00px;
  margin-right: -4.00px;
  margin-top: -4.00px;
  position: relative;
  width: 24px;
}

.homepage .penetration-testing {
  align-self: stretch;
  color: var(--black);
  font-weight: 400;
  line-height: 22px;
  position: relative;
}

.homepage .header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: var(--white);
}

.homepage .industries {
  letter-spacing: 0;
  line-height: 16px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.homepage .light-button-outlined-icon {
  border: 1px solid;
  border-radius: 4px;
  display: inline-flex;
  flex: 0 0 auto;
  padding: 4px 8px;
}

.homepage .system-icons-2 {
  height: 24px;
  position: relative;
  width: 24px;
}

.homepage .line-1 {
  align-self: stretch;
  height: 1px;
  object-fit: cover;
  position: relative;
  width: 100%;
}

.homepage .frame-335 {
  background-color: var(--turquoise-blue);
  bottom: 0;
  height: 735px;
  left: calc(50.00% - 756px);
  position: absolute;
  width: 1512px;
}

.homepage .via-pietro-micca-15 {
  color: var(--black);
  font-weight: 400;
  height: 22.41px;
  line-height: 22px;
  margin-top: 42.8px;
  white-space: nowrap;
  width: 608px;
}

.homepage .line-8 {
  height: 1px;
  left: calc(50.00% - 660px);
  object-fit: cover;
  position: absolute;
  top: 426px;
  width: 1320px;
}

.homepage .frame-4238 {
  align-items: center;
  align-self: stretch;
  border-radius: 4px;
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  justify-content: center;
  overflow: hidden;
  padding: 10px 20px;
  position: relative;
  width: 100%;
}

.homepage .industries-1 {
  letter-spacing: 0;
  line-height: 16px;
  margin-top: -1.00px;
  position: relative;
  white-space: nowrap;
  width: fit-content;
}

.homepage .services-2 {
  align-items: center;
  display: flex;
  justify-content: center;
  letter-spacing: 0;
  line-height: 16px;
  margin-top: -1.00px;
  position: relative;
  text-align: center;
  white-space: nowrap;
  width: fit-content;
}

/* New Header Styles */
.homepage .header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 20px 36px;
}

.homepage .logo {
  display: flex;
  align-items: center;
}

.homepage .logo-img {
  height: 45.48px;
  width: auto;
  object-fit: cover;
}

.homepage .nav {
  display: inline-flex;
  align-items: center;
  gap: 19px;
}

.homepage .nav-link {
  padding: 10px 20px;
  font-family: 'Atkinson Hyperlegible', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--ebony-clay);
  border-radius: 4px;
  text-decoration: none;
  letter-spacing: 0;
  line-height: 16px;
  white-space: nowrap;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.homepage .nav-link.active {
  background-color: var(--mint-tulip);
}

.homepage .nav-link:hover {
  background-color: var(--mint-tulip);
}

.homepage .header-right {
  align-items: center;
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 129px;
}

.homepage .lang-selector {
  align-items: center;
  border: 1px solid var(--ebony-clay);
  border-radius: 4px;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 8px;
  padding: 4px 8px;
  position: relative;
  font-family: var(--font-family-inter);
  font-size: 16px;
  font-weight: 600;
  color: var(--ebony-clay);
}

.homepage .lang-selector svg {
  width: 24px;
  height: 24px;
}

.homepage .user-icon {
  align-items: center;
  background-color: var(--turquoise-blue);
  border-radius: 50%;
  display: flex;
  height: 32px;
  justify-content: center;
  padding: 4px;
  width: 32px;
}

.homepage .user-icon svg {
  width: 24px;
  height: 24px;
}

.homepage .header-line {
  align-self: stretch;
  height: 1px;
  background-color: var(--black);
  position: relative;
  width: 100%;
}

.homepage .menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 8px;
  background: none;
  border: none;
  cursor: pointer;
}

.homepage .menu-toggle span {
  display: block;
  width: 24px;
  height: 2px;
  background-color: var(--ebony-clay);
  border-radius: 2px;
}
