a,
button,
input,
select,
h1,
h2,
h3,
h4,
h5,
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: none;
  text-decoration: none;
  background: none;

  -webkit-font-smoothing: antialiased;
}

menu,
ol,
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.group-1171275058,
.group-1171275058 * {
  box-sizing: border-box;
}
.group-1171275058 {
  /* height: 9200.7px; */
  position: relative;
}
/* section----1 */

.frame-1171274998 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  width: 1920px;
  position: absolute;
  left: 0px;
  top: 68px;
}

.video-background-container {
  position: relative;
  overflow: hidden;
}

.video-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
  background: url(hero_bg1.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.cta-button {
  width: 240px;
  height: 56px;
  position: relative;
}
.frame-6357552 {
  background: #263238;
  border-radius: 8px;
  border-style: solid;
  border-color: #ededed;
  border-width: 1px;
  padding: 22px 48px 22px 48px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  width: max-content;
  height: 56px;
  position: absolute;
  cursor: pointer;
}
.frame-6357552:hover {
  background-color: #677074;
}
.frame-6357552.clicked {
  background-color: #a8adaf;
}
.try-airi-tools {
  color: #ffffff;
  text-align: center;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 18px;
  font-weight: 600;
  position: relative;
}

.frame-6357553:hover {
  background-color: #d4d6d7;
}
.frame-6357553.clicked {
  background-color: #263238;
}
.frame-6357553.clicked .talk-to-airi {
  color: #ffffff !important;
}
.talk-to-airi {
  color: #263238;
  text-align: center;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 18px;
  font-weight: 600;
  position: relative;
}

/* <!-- section-2 --> */
#featureVideo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  display: none; /* Shown when active */
  transition: opacity 0.3s ease;
}
.featureVideo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;

  transition: opacity 0.3s ease;
}
.frame-1171274972 {
  padding: 115px 260px 140px 260px;
  display: flex;
  flex-direction: column;
  gap: 80px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}

.frame-1171275057 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}

.design-smarter-render-faster {
  color: #263238;
  text-align: center;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 72px;
  line-height: 105px;
  font-weight: 600;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
  color: #263238;
  text-align: center;
  font-family: "AlbertSans-Medium", sans-serif;
  font-size: 22px;
  line-height: 165%;
  font-weight: 500;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}

.three-main-features {
  background: #ffffff;
  border-radius: 20px;
  border-style: solid;
  border-color: #ededed;
  border-width: 1px;
  flex-shrink: 0;
  width: 1400px;
  height: 787px;
  position: relative;
  overflow: hidden;
}

.main-feature-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 9;
  border-radius: 20px;
}

._3 {
  width: 1393.65px;
  height: 787px;
  position: absolute;
  left: 2.29px;
  top: 0px;
  aspect-ratio: 1393.65/787;
}

.rectangle-195784 {
  background: url(transparent_block.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 1400px;
  height: 260px;
  position: absolute;
  left: 0px;
  bottom: 0px;
}

.frame-1171274999 {
  padding: 0px 40px 40px 0px;
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  position: absolute;
  right: 0px;
  bottom: 0px;
}

/* Separate container for mobile feature buttons (hidden by default) */
.mobile-feature-buttons {
  display: none;
  width: 100%;
  justify-content: center;
  gap: 20px;
  margin-top: 30px;
  flex-wrap: wrap;
}

.ai-chat {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 198px;
  height: 170px;
  position: relative;
  cursor: pointer;
}

._17483245257099 {
  border-radius: 8px;
  border-width: 1px;
  align-self: stretch;
  flex-shrink: 0;
  height: 112px;
  position: relative;
  object-fit: cover;
  background-color: #ffffff;
}

.ai-chat2 {
  color: #ffffff;
  text-align: center;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 16px;
  line-height: 23px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  height: 30px;
}

.ai-chat3 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 198px;
  position: relative;
  cursor: pointer;
}

._17483245837254 {
  border-radius: 8px;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  object-fit: cover;
  background-color: #ffffff;
}

.ai-chat4 {
  color: #ffffff;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 16px;
  line-height: 23px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 30px;
  width: 196px;
}

.div {
  border-radius: 8px;
  align-self: stretch;
  flex-shrink: 0;
  height: 112px;
  position: relative;
  object-fit: cover;
  background-color: #ffffff;
}

._2 {
  width: 0px;
  height: 0px;
  position: absolute;
  left: 700px;
  top: 394px;
  object-fit: cover;
  aspect-ratio: 0/0;
}

.frame-1171275000 {
  padding: 0px 0px 40px 40px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-end;
  width: 632px;
  position: absolute;
  left: 0px;
  bottom: 0px;
}

.frame-1171275001 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}

.smart-design-assistant {
  color: #ffffff;
  text-align: left;
  font-family: "Inter-SemiBold", sans-serif;
  font-size: 32px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  width: 632px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.engage-description {
  color: #ffffff;
  font-size: 18px;
  font-weight: 500;
  font-family: "Inter-SemiBold", sans-serif;
}

.engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
  color: #263238;
  text-align: left;
  font-family: "AlbertSans-Medium", sans-serif;
  font-size: 18px;
  line-height: 165%;
  font-weight: 500;
  position: relative;
  width: 632px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

._17483245257099.active {
  border: 2px solid #ffffff;
  border-radius: 12px;
}

.ai-chat3.active .ai-chat2,
.ai-chat3.active .ai-chat4 {
  font-size: 16px;
  font-weight: 600;
}

.ai-chat2,
.ai-chat4 {
  transition: all 0.3s ease;
}

/* RESPONSIVE STYLES - 1400px and below */
@media (max-width: 1400px) {
  .frame-1171274972 {
    padding: 80px 40px 100px 40px;
    gap: 60px;
  }

  .design-smarter-render-faster {
    font-size: 60px;
    line-height: 85px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 20px;
  }

  .three-main-features {
    width: 100%;
    max-width: 1200px;
    height: 675px;
  }

  ._3 {
    width: 100%;
    height: 675px;
    left: 0;
  }

  .rectangle-195784 {
    width: 100%;
  }

  /* Hide the original feature buttons */
  .frame-1171274999 {
    display: none;
  }

  /* Show mobile feature buttons */
  .mobile-feature-buttons {
    display: flex;
  }

  /* Style mobile feature buttons */
  .mobile-feature-buttons .ai-chat3 {
    width: 245px;
    background: #ffffff;
    border-radius: 12px;
    padding: 15px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    border: 1px solid #ededed;
  }

  .mobile-feature-buttons ._17483245257099,
  .mobile-feature-buttons ._17483245837254,
  .mobile-feature-buttons .div {
    height: 80px;
  }

  .mobile-feature-buttons .ai-chat2,
  .mobile-feature-buttons .ai-chat4 {
    color: #263238;
    font-size: 14px;
    width: auto;
  }

  /* .frame-1171275000 {
    position: relative;
    width: 100%;
    padding: 30px;
    background: linear-gradient(135deg, rgba(38, 50, 56, 0.9), rgba(38, 50, 56, 0.7));
    border-radius: 16px;
    margin-top: -100px;
    z-index: 10;
  } */

  .smart-design-assistant {
    width: 100%;
    font-size: 28px;
    line-height: 32px;
  }

  .engage-description {
    font-size: 16px;
  }
}

@media (max-width: 1200px) {
  .frame-1171274972 {
    padding: 70px 30px 80px 30px;
    gap: 50px;
  }

  .design-smarter-render-faster {
    font-size: 52px;
    line-height: 75px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 18px;
  }

  .three-main-features {
    max-width: 1000px;
    height: 562px;
  }

  ._3 {
    height: 562px;
  }

  .mobile-feature-buttons .ai-chat3 {
    width: 200px;
    padding: 12px;
  }

  .mobile-feature-buttons ._17483245257099,
  .mobile-feature-buttons ._17483245837254,
  .mobile-feature-buttons .div {
    height: 70px;
  }

  .mobile-feature-buttons .ai-chat2,
  .mobile-feature-buttons .ai-chat4 {
    font-size: 13px;
  }

  .smart-design-assistant {
    font-size: 24px;
    line-height: 28px;
  }

  .engage-description {
    font-size: 15px;
  }
}

@media (max-width: 1024px) {
  .frame-1171274972 {
    padding: 60px 25px 70px 25px;
    gap: 40px;
  }

  .design-smarter-render-faster {
    font-size: 44px;
    line-height: 64px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 16px;
  }

  .three-main-features {
    max-width: 824px;
    height: 463px;
  }

  ._3 {
    height: 463px;
  }

  .mobile-feature-buttons .ai-chat3 {
    width: 170px;
    padding: 10px;
  }

  .mobile-feature-buttons ._17483245257099,
  .mobile-feature-buttons ._17483245837254,
  .mobile-feature-buttons .div {
    height: 60px;
  }

  .mobile-feature-buttons .ai-chat2,
  .mobile-feature-buttons .ai-chat4 {
    font-size: 12px;
  }

  .frame-1171275000 {
    padding: 25px;
    margin-top: -80px;
  }

  .smart-design-assistant {
    font-size: 20px;
    line-height: 24px;
  }

  .engage-description {
    font-size: 14px;
  }
}

@media (max-width: 768px) {
  .frame-1171274972 {
    padding: 40px 20px 50px 20px;
    gap: 30px;
  }

  .design-smarter-render-faster {
    font-size: 36px;
    line-height: 52px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 15px;
  }

  .three-main-features {
    max-width: 648px;
    height: 364px;
  }

  ._3 {
    height: 364px;
  }

  .mobile-feature-buttons {
    gap: 15px;
    margin-top: 25px;
  }

  .mobile-feature-buttons .ai-chat3 {
    width: 170px;
    padding: 8px;
  }

  .mobile-feature-buttons ._17483245257099,
  .mobile-feature-buttons ._17483245837254,
  .mobile-feature-buttons .div {
    height: 50px;
  }

  .mobile-feature-buttons .ai-chat2,
  .mobile-feature-buttons .ai-chat4 {
    font-size: 11px;
    line-height: 16px;
  }

  .frame-1171275000 {
    padding: 20px;
    margin-top: -60px;
  }

  .smart-design-assistant {
    font-size: 18px;
    line-height: 22px;
  }

  .engage-description {
    font-size: 13px;
  }
}

@media (max-width: 640px) {
  .frame-1171274972 {
    padding: 30px 15px 40px 15px;
    gap: 25px;
  }

  .design-smarter-render-faster {
    font-size: 28px;
    line-height: 40px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 14px;
  }

  .three-main-features {
    max-width: 560px;
    height: 315px;
  }

  ._3 {
    height: 315px;
  }

  .mobile-feature-buttons {
    gap: 12px;
    margin-top: 20px;
  }

  .mobile-feature-buttons .ai-chat3 {
    width: 160px;
    padding: 6px;
  }

  .mobile-feature-buttons ._17483245257099,
  .mobile-feature-buttons ._17483245837254,
  .mobile-feature-buttons .div {
    height: 45px;
  }

  .mobile-feature-buttons .ai-chat2,
  .mobile-feature-buttons .ai-chat4 {
    font-size: 10px;
    line-height: 14px;
  }

  .frame-1171275000 {
    padding: 18px;
    margin-top: -50px;
  }

  .smart-design-assistant {
    font-size: 16px;
    line-height: 20px;
  }

  .engage-description {
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .frame-1171274972 {
    padding: 25px 10px 30px 10px;
    gap: 20px;
  }

  .design-smarter-render-faster {
    font-size: 24px;
    line-height: 34px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 13px;
  }

  .three-main-features {
    max-width: 440px;
    height: 247px;
  }

  ._3 {
    height: 247px;
  }

  .mobile-feature-buttons {
    gap: 10px;
    margin-top: 15px;
  }

  .mobile-feature-buttons .ai-chat3 {
    width: 130px;
    padding: 5px;
  }

  .mobile-feature-buttons ._17483245257099,
  .mobile-feature-buttons ._17483245837254,
  .mobile-feature-buttons .div {
    height: 38px;
  }

  .mobile-feature-buttons .ai-chat2,
  .mobile-feature-buttons .ai-chat4 {
    font-size: 9px;
    line-height: 12px;
  }

  .frame-1171275000 {
    padding: 15px;
    margin-top: -40px;
  }

  .smart-design-assistant {
    font-size: 14px;
    line-height: 18px;
  }

  .engage-description {
    font-size: 11px;
  }
}
/* section--3 */
.frame-1171275043 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 1920px;
  position: relative;
  /* min-height: 100vh; */
}

.frame-1171275062 {
  padding: 140px 0px 140px 0px;
  display: flex;
  flex-direction: row;
  gap: 169px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  width: 1920px;
  position: relative;
}

.solution-by-role-cards {
  padding: 140px 0px 140px 0px;
  display: flex;
  flex-direction: row;
  gap: 112px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  width: 1920px;
  position: relative;
}

.group-1171274970 {
  flex-shrink: 0;
  width: 566px;
  height: 866px;
  position: relative;
  top: 140px;
  overflow: hidden;
  transform: translateY(100px);
}

.rectangle-195772 {
  background: #f9f9f9;
  border-radius: 32px;
  width: 566px;
  height: 866px;
  position: absolute;
  left: 0;
  top: 0;
}

.the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
  border-radius: 20px;
  width: 502px;
  height: 478.6px;
  position: absolute;
  left: 32px;
  top: 32px;
  object-fit: cover;
  transition: opacity 0.5s ease-in-out;
}

.rectangle-45 {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.1);
  border-width: 1px;
  width: 302px;
  height: 164px;
  position: absolute;
  left: 53.59px;
  top: 399.63px;
  box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.1),
    0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(15px);
}

.rectangle-195774 {
  border-radius: 8px;
  border-style: solid;
  border-color: #ededed;
  border-width: 0px;
  width: 270px;
  height: 132px;
  position: absolute;
  left: 69.59px;
  top: 415.63px;
  object-fit: cover;
  transition: opacity 0.5s ease-in-out;
}
.image-hidden {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.image-visible {
  opacity: 1;
  transform: translateY(0);
}

.frame-1171275061 {
  display: flex;
  flex-direction: column;
  gap: 72px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 720px;
  position: relative;
}

.solutions-by-industry {
  color: #263238;
  text-align: left;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 64px;
  line-height: 75px;
  letter-spacing: 2px;
  font-weight: 600;
  position: relative;
  width: 720px;
}

.frame-1171275060 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-end;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}

.card-of-solution-by-role {
  padding: 40px 0px 40px 0px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
  transition: all 0.3s ease;
}

.card-of-solution-by-role:hover {
  background: rgba(248, 249, 250, 0.5);
  border-radius: 12px;
}

.frame-1171275059 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}

.for-architects,
.architects {
  color: #000000;
  text-align: left;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 32px;
  line-height: 57.6px;
  font-weight: 600;
  position: relative;
}

.view,
.view2,
.view3,
.view4 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
  aspect-ratio: 1;
  transition: transform 0.3s ease;
  cursor: pointer;
}

.view.disabled,
.view2.disabled,
.view3.disabled,
.view4.disabled {
  opacity: 0.3;
  pointer-events: none;
}

.view.active,
.view2.active,
.view3.active,
.view4.active {
  transform: rotate(180deg);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease-in-out, opacity 0.3s ease;
  opacity: 0;
}

.accordion-content.active {
  max-height: 500px;
  opacity: 1;
}

.bring-visionary-spaces-to-life-faster-with-ai-enhanced-ideation-iteration-and-visual-storytelling-so-you-can-focus-on-design-intent-while-airi-handles-the-visuals-variations-and-presentations {
  color: #263238;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 18px;
  line-height: 23px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  margin-bottom: 24px;
}

.cta-button2 {
  background-color: #ffffff;
  border-radius: 8px;
  padding: 12px 24px;
  cursor: pointer;
  color: #263238;
  border: 1px solid #a8adaf;
  width: max-content;
}

.cta-button2:hover {
  background: #d4d6d7;
}
.cta-button2.clicked {
  background: #263238;
}
.cta-button2.clicked .solution-for-architects {
  color: #ffffff !important;
}

.frame-6357554 {
  display: flex;
  align-items: center;
  justify-content: center;
}

.solution-for-architects {
  color: #263238;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 16px;
  font-weight: 600;
}

.line-44,
.line-48,
.line-47,
.line-46 {
  width: 100%;
  height: 1px;
  background: #e0e0e0;
  margin: 0;
}

.image-hidden {
  opacity: 0;
  pointer-events: none;
}

.image-visible {
  opacity: 1;
  pointer-events: auto;
}

/* Arrow SVG styles */
.arrow-down {
  fill: #263238;
}

/* section----4 */
.frame-1171274973 {
  padding: 140px 240px 140px 240px;
  display: flex;
  flex-direction: column;
  gap: 54px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.frame-1171275018 {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: space-between;
  flex-shrink: 0;
  width: 1400px;
  position: relative;
}
.render-with-airi-s-powerful-rendering-tools {
  color: #263238;
  text-align: left;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 96px;
  line-height: 105px;
  font-weight: 600;
  position: relative;
  width: 1186.5px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.feature-videos {
  border-radius: 12px;
  border-style: solid;
  border-color: #ededed;
  border-width: 1px;
  flex-shrink: 0;
  width: 1400px;
  height: 787.5px;
  position: relative;
  overflow: hidden;
}
.rectangle-195787 {
  /* background: linear-gradient(to left, #d9d9d9, #d9d9d9); */
  width: 1400px;
  height: 787.5px;
  position: absolute;
  left: 0px;
  top: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  /* background: linear-gradient(176.56deg, rgba(217, 217, 217, 0) 2.63%, rgba(255, 255, 255, 0.325) 96.96%); */
}

.rectangle-195787 img {
  max-width: 100%;
  height: auto;
}

/* .rectangle-195787 video {
        max-width: 100%;
        height: auto;
      } */
.arrow {
  position: absolute;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 20px;
  background: url("arrow.png") no-repeat center center;
  background-size: contain;
  display: none;
}

.frame-1171275026 {
  padding: 0px 0px 0px 40px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: center;
  height: 788px;
  position: absolute;
  left: 0px;
  top: 50%;
  transform: translateY(-50%);
  background: linear-gradient(
    to left,
    rgba(217, 217, 217, 0) 0%,
    rgba(255, 255, 255, 0.325) 100%
  );
}
.powerful-toolkit {
  display: flex;
  flex-direction: row;
  gap: 14px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 400px;
  position: relative;
}
.powerful-toolkit.selected .arrow {
  display: block;
}

.powerful-toolkit.selected {
  transform: scale(1.1);
  transition: transform 0.3s ease;
}

.powerful-toolkit:hover {
  cursor: pointer;
  transform: scale(1.05);
  transition: transform 0.3s ease;
}
.polygon-7,
.polygon-72,
.polygon-73,
.polygon-74,
.polygon-75,
.polygon-76,
.polygon-77 {
  border-radius: 0px;
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  position: relative;
  overflow: visible;
  aspect-ratio: 1;
  transition: transform 0.3s ease;
  opacity: 0;
}

/* show arrow only when toolkit is selected */
.powerful-toolkit.selected [class^="polygon-"] {
  opacity: 1;
}
.powerful-toolkit.selected .inspire,
.powerful-toolkit.selected .inspire2 {
  color: #263238;
  font-size: 38px;
}

/* Selected toolkit arrow color */
/* .powerful-toolkit.selected [class^="polygon-"] {
  opacity: 1;
  filter: brightness(0) invert(1);
} */

.inspire,
.inspire2 {
  color: #263238;
  text-align: left;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 32px;
  line-height: 52px;
  font-weight: 700;
  position: relative;
  width: 372px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: transform 0.3s ease;
}

/* section----5   */
.frame-1171275017 {
  padding: 60px 0px 60px 0px;
  display: flex;
  flex-direction: row;
  gap: 474px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1920px;
  position: relative;
}
.frame-1171275063 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  width: 1400px;
  position: relative;
}
.frame-1171275016 {
  display: flex;
  flex-direction: column;
  gap: 60px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 300px;
  position: relative;
}

/* Hover sections styling */
.frame-1171275011,
.frame-1171275012,
.frame-1171275014,
.frame-1171275013 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
  padding: 20px;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.frame-1171275011 {
  width: 300px;
}
.frame-1171275012 {
  width: 100%;
}
.frame-1171275014 {
  width: 100%;
}
.frame-1171275013 {
  width: 329px;
}
._500-000,
._2000,
._200,
._8-mp {
  color: #263238;
  text-align: left;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 60px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
}

._500-000 {
  width: 300px;
}
._2000,
._200 {
  align-self: stretch;
}
._8-mp {
  align-self: stretch;
}

.customizable-templates,
.typologies-and-styles,
.ai-models,
.crisp-output-resolution {
  color: #677074;
  text-align: left;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 18px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.customizable-templates,
.typologies-and-styles,
.ai-models {
  align-self: stretch;
}

/* Image container styling */
.image-container {
  position: relative;
  border-radius: 12px;
  flex-shrink: 0;
  width: 640px;
  height: 680px;
  overflow: hidden;
}

.hover-image {
  position: absolute;
  top: 0;
  left: 0;
  /* width: 985px;
            height: 100%;
            object-fit: contain; */
  opacity: 0;
  transition: opacity 0.4s ease-in-out;
  border-radius: 12px;
}

.hover-image.active {
  opacity: 1;
}

/* Default image (first one visible) */
.hover-image:first-child {
  opacity: 1;
}
.frame-1171275044 {
  padding: 60px 260px 60px 260px;
  display: flex;
  flex-direction: column;
  gap: 80px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.enterprise-grade-security-quality-outputs {
  color: #263238;
  text-align: center;
  font-family: "DmSans-Bold", sans-serif;
  font-size: 42px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}
.enterprise-grade-security-and-an-llm-agnostic-architecture-prioritize-your-data-protection-privacy-while-providing-superior-quality-marketing-outputs {
  color: #263238;
  text-align: center;
  font-family: "AlbertSans-Medium", sans-serif;
  font-size: 22px;
  line-height: 32px;
  font-weight: 500;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
}
.frame-1171275065 {
  display: flex;
  flex-direction: row;
  gap: 32px;
  row-gap: 52px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  flex-shrink: 0;
  width: 1174px;
  position: relative;
}
.enterprise-priviledges {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 370px;
  position: relative;
}
.frame-1171275101 {
  align-self: stretch;
  flex-shrink: 0;
  height: 280px;
  position: relative;
}
.rectangle-195937 {
  background: #263238;
  border-radius: 8px;
  width: 370px;
  height: 280px;
  position: absolute;
  left: 0px;
  top: 0px;
}
.airi-lab-secure-jpg {
  width: 160px;
  height: 160px;
  position: absolute;
  left: 105px;
  top: 60px;
  overflow: visible;
}
.frame-1171275064 {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.frame-1171275132 {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.secure {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 20px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
  height: 40px;
}
.your-data-is-safe-with-us {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 25px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.industry-leading-encryption-and-access-controls-ensure-intellectual-property-and-design-concepts-remain-fully-protected-within-the-organization {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.solar-copyright-outline {
  width: 160px;
  height: 160px;
  position: absolute;
  left: 104.97px;
  top: 60.5px;
  overflow: hidden;
  aspect-ratio: 1;
}
.group {
  width: 89.58%;
  height: 89.58%;
  position: absolute;
  right: 5.21%;
  left: 5.21%;
  bottom: 5.21%;
  top: 5.21%;
  overflow: visible;
}
.copyright {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 20px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
  height: 40px;
}
.full-ownership-zero-restrictions {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 25px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.unlimited-commercial-rights-with-no-additional-licensing-fees-or-third-party-claims-design-freely-with-complete-peace-of-mind {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.group-634088 {
  position: absolute;
  inset: 0;
}

.group-634066 {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 25%;
  left: 30%;
  transform: translate(-50%, -50%);
}
.team-synergy {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 20px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
  height: 40px;
}
.collaborate-seamlessly-across-your-team {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 25px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.real-time-collaboration-via-shared-asset-libraries-and-centralized-design-templates-enables-teams-to-work-without-silos-or-duplicated-effort {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.frame-1171275105 {
  width: 160px;
  height: 160px;
  position: absolute;
  left: 104.97px;
  top: 60.5px;
  overflow: hidden;
  aspect-ratio: 1;
}
.humbleicons-box {
  width: 74px;
  height: 74px;
  position: absolute;
  left: 40.61px;
  top: 41px;
  overflow: visible;
  aspect-ratio: 1;
}
.group-1171275059 {
  height: auto;
  position: absolute;
  left: 8.61px;
  top: 2px;
  overflow: visible;
}
.group-1171275060 {
  width: 66.25%;
  height: 69.97%;
  position: absolute;
  right: 18.37%;
  left: 15.38%;
  bottom: 17.19%;
  top: 12.85%;
  overflow: visible;
}
.customized-model {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 20px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
  height: 40px;
}
.tailored-ai-models-for-your-workflow {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 25px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ai-model-customization-for-both-pre-production-ideation-and-post-production-refinement-tailored-to-match-unique-aesthetic-and-technical-criteria {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.frame-1171275103 {
  background: rgba(0, 0, 0, 0);
  width: 160px;
  height: 160px;
  position: absolute;
  left: 104.97px;
  top: 60.5px;
  overflow: hidden;
  aspect-ratio: 1;
}
.ph-chalkboard-teacher-light {
  width: 160px;
  height: 160px;
  position: absolute;
  left: 0px;
  top: 0px;
  overflow: visible;
  aspect-ratio: 1;
}
.support {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 20px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
  height: 40px;
}
.dedicated-and-expert-assistance {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 25px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hands-on-training-onboarding-workflow-consulting-and-continuous-technical-support-empower-teams-to-rapidly-maximize-productivity {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.airi-lab-customized-jpg {
  width: 160px;
  height: 160px;
  position: absolute;
  left: 104.97px;
  top: 60.5px;
}
.airi-lab-customized-jpg2 {
  background: #263238;
  width: 160px;
  height: 160px;
  position: absolute;
  left: 0px;
  top: 0px;
}
.group-634065 {
  position: absolute;
  inset: 0;
}
.frame {
  width: 133.05px;
  height: 128px;
  position: absolute;
  left: 13.48px;
  top: 16px;
}
.group-634064 {
  width: 82.28%;
  height: 81.58%;
  position: absolute;
  right: 10.13%;
  left: 7.59%;
  bottom: 6.58%;
  top: 11.84%;
  overflow: visible;
}
.oem {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Bold", sans-serif;
  font-size: 20px;
  line-height: 52px;
  letter-spacing: -0.4px;
  font-weight: 700;
  position: relative;
  align-self: stretch;
  height: 40px;
}
.flexible-deployment-options {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 20px;
  line-height: 25px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.from-cloud-based-saa-s-to-on-premises-installations-can-be-tailored-to-fit-it-infrastructure-security-policies-and-operational-preferences-enabling-seamless-integration {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: -0.4px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}

/* footer css */
.frame-1171275019 {
  padding: 60px 240px 60px 240px;
  display: flex;
  flex-direction: column;
  gap: 65px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.92);
}
.footer-video {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  object-fit: cover;
}
/* .footer-video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 1;
    pointer-events: none; 
  } */
.footer-video {
  z-index: -1;
}
/* .footer-video-overlay {
      background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0,0,0,0));
    } */

.frame-1171275072 {
  padding: 0px 0px 140px 0px;
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  z-index: 9;
  width: 562px;
}
.create-anywhere-anytime {
  color: #ffffff;
  text-align: center;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 72px;
  line-height: 105px;
  font-weight: 600;
  position: relative;
  width: 1400px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.frame-11712749982 {
  flex-shrink: 0;
  width: 1400px;
  height: 496px;
  position: relative;
  overflow: hidden;
  z-index: 9;
}
._32 {
  width: 1393.65px;
  height: 787px;
  position: absolute;
  left: 2.29px;
  top: -53.01px;
  aspect-ratio: 1393.65/787;
}
._22 {
  width: 0px;
  height: 0px;
  position: absolute;
  left: 700px;
  top: 340.99px;
  object-fit: cover;
  aspect-ratio: 0/0;
}
.group-1171275057 {
  position: absolute;
  inset: 0;
}
.frame-1171275029 {
  background: #ffffff;
  border-radius: 12px;
  border-style: solid;
  border-color: #636363;
  border-width: 1px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: 467.24px;
  top: 12.2px;
}
.image-934 {
  align-self: stretch;
  flex-shrink: 0;
  height: 293.83px;
  position: relative;
  object-fit: cover;
  aspect-ratio: 584/293.83;
}
.frame-1171275099 {
  width: 210.53px;
  height: 100px;
  position: absolute;
  left: 974.24px;
  top: 240.99px;
}
.rectangle-195951 {
  background: #ffffff;
  border-radius: 12px;
  border-style: solid;
  border-color: #a8adaf;
  border-width: 1px;
  width: 100px;
  height: 210.53px;
  position: absolute;
  left: 0px;
  top: 100px;
  transform-origin: 0 0;
  transform: rotate(-90deg) scale(1, 1);
  aspect-ratio: 100/210.53;
}
.image {
  width: 200.78px;
  height: 89.79px;
  position: absolute;
  left: 4.88px;
  top: 5.1px;
  object-fit: cover;
  aspect-ratio: 200.78/89.79;
}
.frame-1171275030 {
  background: #ffffff;
  border-radius: 12px;
  border-style: solid;
  border-color: #a8adaf;
  border-width: 1px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: 215.24px;
  top: 186.65px;
}
.image2 {
  border-radius: 2px;
  flex-shrink: 0;
  width: 375px;
  height: 188.68px;
  position: relative;
  object-fit: cover;
  aspect-ratio: 375/188.68;
}
.no-downloads-needed-use-airi-lab-seamlessly-across-devices-right-from-your-browser {
  color: #ffffff;
  text-align: center;
  font-family: "AlbertSans-Medium", sans-serif;
  font-size: 14px;
  line-height: 165%;
  font-weight: 500;
  position: absolute;
  left: 0px;
  top: 473.04px;
  width: 1395.94px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tooltip {
  position: fixed;
  background: white;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 12px;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  pointer-events: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  min-width: 140px;
}

.tooltip.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.tooltip h4 {
  margin: 0 0 8px 0;
  font-size: 14px;
  color: #333;
  font-weight: 500;
}

.tooltip p {
  margin: 0 0 12px 0;
  font-size: 12px;
  color: #666;
  line-height: 1.3;
}

.tooltip img {
  width: 200px;
  height: 200px;
  border: 1px solid #eee;
  border-radius: 4px;
}
.frame-634995 {
  padding: 0px 0px 24px 0px;
  display: flex;
  flex-direction: row;
  gap: 156px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 1188px;
  position: relative;
  z-index: 9;
}
.frame-635068 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.contact-us-86-18165737937-airilab-com-contact-time-monday-to-friday-9-30-19-00 {
  color: #ffffff;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  font-weight: 400;
  position: relative;
  width: 523px;
}
.group-634062 {
  flex-shrink: 0;
  width: 144px;
  height: 24px;
  position: static;
}
.frame-635049 {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: 0px;
  top: 66px;
  margin-top: 20px;
}
.mingcute-bilibili-line {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: hidden;
  aspect-ratio: 1;
  cursor: pointer;
  transition: transform 0.3s ease;
}
.group5 {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 8.33%;
  left: 8.33%;
  bottom: 0.77%;
  /* top: 12.5%; */
  overflow: visible;
}
.ic-baseline-wechat {
  width: 24px;
  height: 24px;
  position: relative;
  cursor: pointer;
}
.xiaohongshu-logo-1 {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.frame-634994 {
  display: flex;
  flex-direction: row;
  gap: 48px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.frame-634992 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
}
.frame-634992:hover {
  background-color: #a8adaf;
}
.platform {
  color: #ffffff;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 16px;
  font-weight: 400;
  position: relative;
  width: 64px;
  height: 20px;
}
.frame-634993 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
}
.frame-634993:hover {
  background-color: #a8adaf;
}
.solutions {
  color: #ffffff;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 16px;
  font-weight: 400;
  position: relative;
}
.frame-6349942 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
}
.frame-6349942:hover {
  background-color: #a8adaf;
}
.company {
  color: #ffffff;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 16px;
  font-weight: 400;
  position: relative;
}
.airi-s-logo-04-1 {
  flex-shrink: 0;
  width: 1188px;
  height: 332.15px;
  position: relative;
  object-fit: cover;
  aspect-ratio: 1188/332.15;
  z-index: 9;
  cursor: pointer;
}
.vector-298 {
  flex-shrink: 0;
  width: 1188px;
  height: 0px;
  position: relative;
  overflow: visible;
}
.frame-634996 {
  padding: 0px 0px 24px 0px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  z-index: 9;
}
.frame-634984 {
  padding: 0px 0px 24px 0px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  height: 17px;
  position: relative;
}
.frame-634972 {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 1187px;
  position: relative;
}
.company-adress-room-1203-3-huanqiao-business-building-shahe-street-nanshan-district-shenzhen {
  color: #d4d6d7;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  font-weight: 400;
  position: relative;
  width: 1187px;
}
.frame-634985 {
  padding: 0px 0px 24px 0px;
  display: flex;
  flex-direction: row;
  gap: 40px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 1188px;
  height: 17px;
  position: relative;
}
.frame-6349722 {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  width: 1187px;
  height: 17px;
  position: relative;
}
.airui-intelligent-technology-shenzhen-co-ltd {
  color: #ffffff;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  font-weight: 400;
  position: relative;
}
.copyright-2023-airi-lab {
  color: #ffffff;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  font-weight: 400;
  position: relative;
}
.guangdong-icp-no-17108204 {
  color: #ffffff;
  text-align: left;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  font-weight: 400;
  position: relative;
  cursor: pointer;
}
.frame-635200 {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  position: relative;
}
.logo-01-6189-a-29-f-1-1 {
  flex-shrink: 0;
  width: 14.81px;
  height: 16px;
  position: relative;
  object-fit: cover;
}
.guangdong-public-security-bureau-no-44030002003609 {
  color: #ffffff;
  text-align: right;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  font-weight: 400;
  position: relative;
  cursor: pointer;
}
.group-1171274945 {
  width: 100%;
  height: auto;
  position: fixed;
  background: #ffffff;
  z-index: 999;
}

.header-css-659-c-1-v {
  background: rgba(255, 255, 255, 0.9);
  padding: 10px 16px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 68px;
  position: relative;
  left: auto;
  transform: none;
  top: 0px;
  box-sizing: border-box;
}

.group-633357 {
  flex-shrink: 0;
  width: auto;
  height: 48px;
  position: relative;
  display: flex;
  align-items: center;
}

.frame-633475 {
  padding: 0px 12px 0px 0px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  height: 48px;
  position: relative;
  left: auto;
  top: auto;
  cursor: pointer;
}

.airi-lab-logo-jpg {
  flex-shrink: 0;
  width: 85.69px;
  height: 20px;
  position: relative;
  object-fit: cover;
}

.frame-1171275066 {
  display: none;
  flex-direction: row;
  gap: 24px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}

.header-buttons {
  border-radius: 6px;
  padding: 6px 8px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.header-buttons:hover {
  background-color: rgba(0, 0, 0, 0.05);
  border: 1px solid #263238;
}

.header-buttons.clicked {
  background: #263238;
}
.header-buttons.clicked .platform1 {
  color: #fff;
}
.header-buttons.clicked .platform2 {
  color: #fff;
}
.platform1.clicked1 {
  background: #263238;
  color: #fff;
}
.platform1 {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 14px;
  font-weight: 400;
  position: relative;
  white-space: nowrap;
}
.platform2 {
  color: #000000;
  text-align: center;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  line-height: 14px;
  font-weight: 400;
  position: relative;
  white-space: nowrap;
}

.frame-1171275067 {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}

.header-cta {
  background: #263238;
  border-radius: 6px;
  border: 1px solid #ededed;
  padding: 8px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 36px;
  position: relative;
  cursor: pointer;
  transition: background-color 0.2s ease;
  box-sizing: border-box;
}

.header-cta:hover {
  background-color: #37474f;
}
.header-cta.clicked {
  background-color: #a8adaf;
}

.try-airi-tools2 {
  color: #ffffff;
  text-align: center;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 14px;
  font-weight: 600;
  position: relative;
  white-space: nowrap;
}
.header-avatar {
  padding: 8px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  height: 36px;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease;
  box-sizing: border-box;
}
.header-cta2 {
  border-radius: 6px;
  border: 1px solid #263238;
  padding: 8px 12px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  height: 36px;
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease;
  box-sizing: border-box;
}

.header-cta2:hover {
  background-color: #d4d6d7;
}
.header-cta2.clicked {
  background-color: #263238;
}
.header-cta2.clicked .sign-in {
  color: #ffffff !important;
}

.header-cta2:hover .sign-in {
  color: #263238;
}

.sign-in {
  color: #263238;
  text-align: center;
  font-family: "AlbertSans-SemiBold", sans-serif;
  font-size: 14px;
  font-weight: 600;
  position: relative;
  white-space: nowrap;
  transition: color 0.2s ease;
}
.dropdown {
  position: relative;
  display: inline-block;
  width: 130px;
  display: flex;
  justify-content: center;
  border-radius: 6px;
  border: 1px solid #263238;
  padding: 8px 12px;
  cursor: pointer;
}
.dropdown1 {
  position: relative;
  display: inline-block;
  /* width: 130px; */
  display: flex;
  justify-content: center;
  border-radius: 6px;
  border: 1px solid #263238;
  padding: 8px 12px;
  cursor: pointer;
}
.dropbtn {
  font-size: 14px;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #263238;
  font-family: "AlbertSans-SemiBold", sans-serif;
  background: none;
  border: none;
  cursor: pointer;
}
.dropbtn1 {
  font-size: 14px;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #263238;
  font-family: "AlbertSans-SemiBold", sans-serif;
  background: none;
  border: none;
  cursor: pointer;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  z-index: 1;
  width: 130px;
  border-radius: 6px;
  margin-top: 27px;
  border: 1px solid#263238;
  top: 12px;
}
.dropdown-content1 {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  z-index: 1;
  width: 130px;
  border-radius: 6px;
  margin-top: 27px;
  border: 1px solid#263238;
  right: -2px;
  top: 15px;
}
.dropdown-content a {
  color: #263238;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-family: "AlbertSans-SemiBold", sans-serif;
  text-align: end;
  font-size: 14px;
  font-weight: 400;
}
.dropdown-content1 a {
  color: #263238;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-family: "AlbertSans-SemiBold", sans-serif;
  text-align: end;
  font-size: 14px;
  font-weight: 400;
}
.dropdown-content a:hover {
  background-color: #d4d6d7;
  border-radius: 6px;
  color: #263238;
}
.dropdown-content1 a:hover {
  background-color: #d4d6d7;
  border-radius: 6px;
  color: #263238;
}

.dropdown:hover .dropdown-content {
  display: block;
}
.dropdown1:hover .dropdown-content1 {
  display: block;
}
.avatar-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  right: 10px;
  background: white;
  border: 1px solid #ddd;
  border-radius: 8px;
  min-width: 180px;
  z-index: 1000;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  margin-top: 8px;
}

.avatar-dropdown.show {
  display: block;
  animation: fadeIn 0.2s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.avatar-dropdown-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  text-decoration: none;
  color: #333;
  transition: background-color 0.2s ease;
  border-bottom: 1px solid #f0f0f0;
  position: relative;
  font-family: "AlbertSans-Regular", sans-serif;
  font-size: 14px;
  font-weight: 400;
}

.avatar-dropdown-item:last-child {
  border-bottom: none;
}

.avatar-dropdown-item:hover {
  background-color: #d4d6d7;
  border-radius: 4px;
}

.avatar-dropdown-item:active {
  background-color: #e9ecef;
}

.avatar-dropdown-item.logout:hover {
  background-color: #d4d6d7;
  /* color: #dc3545; */
}
.icon-container {
  width: 16px;
  height: 16px;
  position: relative;
  display: inline-block;
}
.icon-container img {
  width: 16px;
  height: 16px;
  position: absolute;
  top: 0;
  left: 0;
  transition: opacity 0.2s ease;
}
.icon-container img.default {
  opacity: 1;
}
.icon-container img.active {
  opacity: 1;
}
.avatar-dropdown-item:hover .icon-container img.default {
  opacity: 1;
}
.avatar-dropdown-item:hover .icon-container img.active {
  opacity: 1;
}
.single-icon {
  width: 16px;
  height: 16px;
  opacity: 0.7;
  transition: opacity 0.2s ease;
}

.avatar-dropdown-item:hover .single-icon {
  opacity: 1;
}
/* Mobile controls container */
.mobile-controls {
  display: none;
  align-items: center;
  gap: 12px;
}
/* Mobile dropdown styling */
.mobile-dropdown {
  width: auto;
  min-width: 60px;
  padding: 6px 10px;
  border: 1px solid #263238;
}

.mobile-dropdown .dropbtn {
  font-size: 12px;
  gap: 6px;
}

.mobile-dropdown .dropdown-content {
  width: 120px;
  right: 0;
  left: auto;
}
.hamburger {
  display: flex;
  flex-direction: column;
  cursor: pointer;
  padding: 4px;
  background: none;
  border: none;
}

.hamburger span {
  width: 25px;
  height: 3px;
  background-color: #263238;
  margin: 3px 0;
  transition: 0.3s;
  border-radius: 2px;
}

.hamburger.active span:nth-child(1) {
  transform: rotate(-45deg) translate(-5px, 6px);
}

.hamburger.active span:nth-child(2) {
  opacity: 0;
}

.hamburger.active span:nth-child(3) {
  transform: rotate(45deg) translate(-5px, -6px);
}

/* Mobile menu */
.mobile-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  border-top: 1px solid #ededed;
  padding: 20px 16px;
  flex-direction: column;
  gap: 16px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.mobile-menu.show {
  display: flex;
}

.mobile-menu .header-cta,
.mobile-menu .header-cta2 {
  width: 100%;
  justify-content: center;
}

@media (max-width: 768px) {
  .frame-1171275067 {
    display: none;
  }

  .mobile-controls {
    display: flex;
  }

  .header-css-659-c-1-v {
    padding: 10px 16px;
  }
  .avatar-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    right: 10px;
    background: white;
    border: 1px solid #ddd;
    border-radius: 8px;
    min-width: 180px;
    z-index: 1000;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    margin-top: 8px;
  }

  .avatar-dropdown.show {
    display: block;
    animation: fadeIn 0.2s ease;
  }

  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translateY(-10px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .avatar-dropdown-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    text-decoration: none;
    color: #333;
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
    font-family: "AlbertSans-Regular", sans-serif;
    font-size: 14px;
    font-weight: 400;
  }

  .avatar-dropdown-item:last-child {
    border-bottom: none;
  }

  .avatar-dropdown-item:hover {
    background-color: #d4d6d7;
    border-radius: 4px;
  }

  .avatar-dropdown-item:active {
    background-color: #e9ecef;
  }

  .avatar-dropdown-item.logout:hover {
    background-color: #d4d6d7;
    /* color: #dc3545; */
  }
  .icon-container {
    width: 16px;
    height: 16px;
    position: relative;
    display: inline-block;
  }
  .icon-container img {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity 0.2s ease;
  }
  .icon-container img.default {
    opacity: 1;
  }

  .icon-container img.active {
    opacity: 1;
  }
  .avatar-dropdown-item:hover .icon-container img.default {
    opacity: 1;
  }

  .avatar-dropdown-item:hover .icon-container img.active {
    opacity: 1;
  }
  .single-icon {
    width: 16px;
    height: 16px;
    opacity: 0.7;
    transition: opacity 0.2s ease;
  }
  .avatar-dropdown-item:hover .single-icon {
    opacity: 1;
  }
}

/* Translate icon placeholder */
.translate-icon {
  width: 16px;
  height: 16px;
  background: #263238;
  border-radius: 2px;
  display: inline-block;
}

@keyframes marqueeScroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

/* Large desktop - 1610px and above */
@media screen and (min-width: 1610px) {
  /* header---- */
  .frame-1171275066 {
    display: flex;
    gap: 24px;
  }

  .frame-1171275067 {
    gap: 12px;
  }

  .mobile-menu-button {
    display: none;
  }

  .frame-1171275027 {
    width: 95%;
  }
  .frame-1171274998 {
    width: 100%;
  }
  .rectangle-195788 {
    width: 1905px;
  }
  .frame-1171275043 {
    width: 1905px;
  }
  .frame-1171275062 {
    width: 1905px;
  }
  .solution-by-role-cards {
    width: 1905px;
  }
  .frame-1171275017 {
    width: 1905px;
  }

  .frame-1171274972 {
    width: 100%;
    padding: 160px 260px 140px 260px;
  }

  .three-main-features {
    width: 100%;
    max-width: 1400px;
  }

  .frame-1171275000 {
    width: 100%;
    max-width: 490px;
  }

  .smart-design-assistant {
    width: 100%;
  }

  .engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
    width: 100%;
  }

  .frame-1171275043 {
    width: 100%;
  }

  .frame-1171275062 {
    width: 100%;
    padding: 60px;
  }

  .solution-by-role-cards {
    width: 100%;
    padding: 140px 60px 140px 60px;
  }

  .group-1171274970 {
    width: 100%;
    max-width: 566px;
  }

  .rectangle-195772 {
    width: 100%;
    max-width: 566px;
  }

  .the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
    width: 100%;
    max-width: 502px;
  }

  .frame-1171275061 {
    width: 100%;
    max-width: 720px;
  }

  .solutions-by-industry {
    width: 100%;
  }

  .frame-1171274973 {
    width: 100%;
    padding: 60px 240px 60px 240px;
  }

  .frame-1171275018 {
    width: 100%;
    max-width: 1400px;
    gap: 40px;
  }

  .render-with-airi-s-powerful-rendering-tools {
    width: 100%;
    max-width: 1186.5px;
  }

  .feature-videos {
    width: 100%;
    max-width: 1400px;
  }

  .rectangle-195787 {
    width: 100%;
    max-width: 1400px;
  }

  .frame-1171275026 {
    width: 100%;
    max-width: 425px;
  }

  .powerful-toolkit {
    width: 100%;
    max-width: 400px;
  }

  .inspire,
  .inspire2 {
    width: 100%;
    max-width: 372px;
  }
}

/* Desktop - 1250px to 1609px */
@media screen and (min-width: 1250px) and (max-width: 1609px) {
  /* header---- */
  .scroll_cont {
    left: 300px;
    width: 500px;
  }
  .frame-1171275066 {
    display: flex;
    gap: 24px;
  }

  .frame-1171275067 {
    gap: 12px;
  }

  .platform2 {
    font-size: 14px;
  }

  .header-cta,
  .header-cta2 {
    padding: 8px 16px;
  }

  .mobile-menu-button {
    display: none;
  }
  .frame-1171275027 {
    width: 100%;
  }
  .frame-1171274998 {
    width: 100%;
  }

  .frame-1171275027 {
    width: 100%;
  }

  .group-1171274978 {
    width: 100%;
  }

  .frame-1171274978 {
    width: 100%;
    animation: marqueeScroll 200s linear infinite;
  }

  .rectangle-195788 {
    width: 100%;
  }

  .frame-1171274971 {
    padding: 100px 180px 120px 180px;
  }

  .ai-powered-design-tools-for-architects-designers-and-planners {
    font-size: 80px;
    line-height: 88px;
    width: 1130px;
  }

  .streamline-your-workflow-with-powerful-ai-powered-image-generation-design-refinement-and-creative-exploration-built-by-architects-for-architects {
    font-size: 20px;
  }

  .frame-1171274978 {
    padding: 0px 180px;
    gap: 100px;
  }

  .frame-1171274972 {
    width: 100%;
    padding: 100px 200px 120px 200px;
  }

  .three-main-features {
    width: 100%;
    max-width: 1200px;
  }

  .frame-1171275000 {
    width: 100%;
    max-width: 405px;
    /* bottom: 520px; */
    padding-left: 10px;
  }

  .smart-design-assistant {
    width: 100%;
    font-size: 28px;
    line-height: 32px;
  }

  .engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
    width: 100%;
    font-size: 16px;
  }

  .design-smarter-render-faster {
    font-size: 64px;
    line-height: 90px;
  }

  .frame-1171275043 {
    width: 100%;
  }

  .frame-1171275062 {
    width: 100%;
    padding: 120px 40px 120px 40px;
    gap: 120px;
  }

  .solution-by-role-cards {
    width: 100%;
    padding: 120px 40px 120px 40px;
    gap: 80px;
  }

  .group-1171274970 {
    width: 100%;
    max-width: 480px;
    height: 750px;
  }

  .rectangle-195772 {
    width: 100%;
    max-width: 480px;
    height: 750px;
  }

  .the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
    width: 100%;
    max-width: 420px;
    height: 400px;
  }

  .frame-1171275061 {
    width: 100%;
    max-width: 620px;
  }

  .solutions-by-industry {
    width: 100%;
    font-size: 56px;
    line-height: 65px;
  }

  .for-architects,
  .architects {
    font-size: 28px;
    line-height: 50px;
  }

  .frame-1171274973 {
    width: 100%;
    padding: 120px 180px 120px 180px;
  }

  .frame-1171275018 {
    /* width: 100%; */
    max-width: 1200px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
  }

  .render-with-airi-s-powerful-rendering-tools {
    /* width: 100%; */
    font-size: 80px;
    line-height: 90px;
    display: flex;
    justify-content: center;
  }

  .feature-videos {
    width: 100%;
    max-width: 1200px;
    height: 675px;
  }

  .rectangle-195787 {
    width: 100%;
    max-width: 1200px;
    height: 675px;
  }

  .frame-1171275026 {
    width: 100%;
    max-width: 350px;
    height: 676px;
  }

  .powerful-toolkit {
    width: 100%;
    max-width: 350px;
  }

  .inspire,
  .inspire2 {
    width: 100%;
    max-width: 322px;
    font-size: 28px;
    line-height: 46px;
  }

  .frame-1171275017 {
    width: 100%;
    padding: 120px 40px;
    gap: 300px;
  }

  .frame-1171275063 {
    width: 100%;
    max-width: 1200px;
  }

  .image-container {
    width: 540px;
    height: 580px;
  }

  .frame-1171275044 {
    padding: 80px 160px 100px 160px;
  }
  .frame-1171275065 {
    width: 100%;
    max-width: 1100px;
    justify-content: center;
  }

  .frame-1171275019 {
    padding: 80px 120px 40px 120px;
  }

  .create-anywhere-anytime {
    /* width: 100%; */
    max-width: 1200px;
    font-size: 64px;
    line-height: 90px;
  }

  .frame-11712749982 {
    /* width: 100%; */
    max-width: 1200px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    left: 50px;
  }

  .frame-634995 {
    width: 100%;
    max-width: 1000px;
    gap: 100px;
  }

  /* .airi-s-logo-04-1,
  .vector-298 {
    width: 100%;
    max-width: 1200px;
  } */

  /* .frame-634972,
  .frame-6349722 {
    width: 100%;
    max-width: 1000px;
  } */

  /* .company-adress-room-1203-3-huanqiao-business-building-shahe-street-nanshan-district-shenzhen {
    width: 100%;
    max-width: 1000px;
  }
   */
  .frame-634985 {
    width: 100%;
    max-width: 1000px;
  }
  ._32 {
    width: 1393.65px;
    left: 0px;
    top: 0px;
    aspect-ratio: 0;
    position: relative;
  }
  .frame-1171275029 {
    left: 285px;
  }
  .frame-1171275030 {
    left: 65px;
  }
  .frame-1171275099 {
    left: 825px;
  }
  .no-downloads-needed-use-airi-lab-seamlessly-across-devices-right-from-your-browser {
    width: 100%;
  }
  .frame-1171274999 {
    padding: 0px 10px 20px 0px;
  }
}
/* Large tablets and medium laptops - 1090px to 1249px */
@media screen and (min-width: 1090px) and (max-width: 1249px) {
  /* header---- */

  .scroll_cont {
    left: 270px;
    width: 400px;
    top: 500px;
  }
  .header-css-659-c-1-v {
    padding: 10px 28px;
    max-width: 1200px;
    margin: 0 auto;
  }

  .frame-1171275066 {
    display: flex;
    gap: 20px;
  }

  .frame-1171275067 {
    gap: 12px;
  }

  .platform2 {
    font-size: 14px;
  }

  .header-cta,
  .header-cta2 {
    padding: 8px 16px;
  }

  .mobile-menu-button {
    display: none;
  }
  .frame-1171275027 {
    width: 100%;
  }

  .frame-1171274998 {
    width: 100%;
  }

  .frame-1171275027 {
    width: 100%;
  }

  .group-1171274978 {
    width: 100%;
  }

  .frame-1171274978 {
    width: 100%;
  }

  .rectangle-195788 {
    width: 100%;
  }

  .frame-1171274971 {
    padding: 80px 120px 100px 120px;
  }

  .ai-powered-design-tools-for-architects-designers-and-planners {
    font-size: 64px;
    line-height: 70px;
  }

  .streamline-your-workflow-with-powerful-ai-powered-image-generation-design-refinement-and-creative-exploration-built-by-architects-for-architects {
    font-size: 18px;
  }

  .frame-1171275028 {
    gap: 50px;
  }

  .frame-1171274978 {
    padding: 0px 120px;
    gap: 80px;
  }

  .frame-1171274972 {
    width: 100%;
    padding: 80px 150px 100px 150px;
  }

  .three-main-features {
    width: 100%;
    max-width: 1000px;
    height: 650px;
  }

  .frame-1171275000 {
    width: 100%;
    max-width: 480px;
    /* bottom: 380px; */
  }

  .smart-design-assistant {
    width: 100%;
    font-size: 24px;
    line-height: 28px;
  }

  .engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
    width: 100%;
    font-size: 16px;
  }

  .design-smarter-render-faster {
    font-size: 56px;
    line-height: 80px;
  }

  .ai-chat,
  .ai-chat3 {
    width: 160px;
  }

  .frame-1171275043 {
    width: 100%;
  }

  .frame-1171275062 {
    width: 100%;
    padding: 0px 30px 0px 30px;
    gap: 80px;
  }

  .solution-by-role-cards {
    width: 100%;
    padding: 100px 30px 100px 30px;
    gap: 60px;
  }

  .group-1171274970 {
    width: 100%;
    max-width: 420px;
    height: 650px;
  }

  .rectangle-195772 {
    width: 100%;
    max-width: 420px;
    height: 650px;
  }

  .the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
    width: 100%;
    max-width: 360px;
    height: 350px;
  }

  .frame-1171275061 {
    width: 100%;
    max-width: 520px;
    gap: 60px;
  }

  .solutions-by-industry {
    width: 100%;
    font-size: 48px;
    line-height: 56px;
  }

  .for-architects,
  .architects {
    font-size: 24px;
    line-height: 42px;
  }

  .bring-visionary-spaces-to-life-faster-with-ai-enhanced-ideation-iteration-and-visual-storytelling-so-you-can-focus-on-design-intent-while-airi-handles-the-visuals-variations-and-presentations {
    font-size: 16px;
    line-height: 21px;
  }
  .rectangle-45 {
    top: 300px;
  }
  .rectangle-195774 {
    top: 315px;
  }

  .frame-1171274973 {
    width: 100%;
    padding: 100px 120px 100px 120px;
  }

  .frame-1171275018 {
    /* width: 100%; */
    /* max-width: 1000px; */
    flex-direction: column;
    align-items: center;
    gap: 40px;
  }

  .render-with-airi-s-powerful-rendering-tools {
    /* width: 100%; */
    font-size: 68px;
    line-height: 75px;
    display: flex;
    justify-content: center;
  }

  .feature-videos {
    width: 100%;
    max-width: 1000px;
    height: 562px;
  }

  .rectangle-195787 {
    width: 100%;
    max-width: 1000px;
    height: 562px;
  }

  .frame-1171275026 {
    width: 100%;
    max-width: 320px;
    height: 563px;
  }

  .powerful-toolkit {
    width: 100%;
    max-width: 320px;
  }

  .inspire,
  .inspire2 {
    width: 100%;
    max-width: 292px;
    font-size: 24px;
    line-height: 40px;
  }

  .frame-1171275017 {
    width: 100%;
    padding: 100px 30px;
    gap: 200px;
  }

  .frame-1171275063 {
    width: 100%;
    max-width: 1000px;
  }

  .image-container {
    width: 480px;
    height: 520px;
  }

  ._500-000,
  ._2000,
  ._200,
  ._8-mp {
    font-size: 50px;
    line-height: 44px;
  }
  .frame-1171275044 {
    padding: 60px 80px 80px 80px;
  }
  .frame-1171275065 {
    width: 100%;
    max-width: 800px;
    justify-content: center;
  }
  .enterprise-grade-security-quality-outputs {
    font-size: 36px;
    line-height: 44px;
  }
  .enterprise-grade-security-and-an-llm-agnostic-architecture-prioritize-your-data-protection-privacy-while-providing-superior-quality-marketing-outputs {
    font-size: 20px;
    line-height: 28px;
  }

  .frame-1171275019 {
    padding: 60px 80px 40px 80px;
  }

  .create-anywhere-anytime {
    /* width: 100%; */
    max-width: 1000px;
    font-size: 56px;
    line-height: 78px;
  }

  .frame-11712749982 {
    /* width: 100%; */
    max-width: 1000px;
    height: 400px;
  }

  .frame-634995 {
    width: 100%;
    max-width: 900px;
    gap: 80px;
  }

  /* .airi-s-logo-04-1,
  .vector-298 {
    width: 100%;
    max-width: 900px;
  } */

  .frame-634972,
  .frame-6349722 {
    width: 100%;
    max-width: 900px;
  }

  .company-adress-room-1203-3-huanqiao-business-building-shahe-street-nanshan-district-shenzhen {
    width: 100%;
    max-width: 900px;
  }

  .frame-634985 {
    width: 100%;
    max-width: 900px;
  }
  ._32 {
    width: 1393.65px;
    left: 0px;
    top: 0px;
    aspect-ratio: 0;
    position: relative;
  }

  .frame-1171275029 {
    left: 255px;
  }
  .frame-1171275030 {
    left: 30px;
  }
  .frame-1171275099 {
    left: 748px;
  }
  .no-downloads-needed-use-airi-lab-seamlessly-across-devices-right-from-your-browser {
    width: 100%;
  }
}

/* Medium tablets and small laptops - 768px to 1089px */
@media screen and (min-width: 768px) and (max-width: 1089px) {
  .scroll_cont {
    left: 65px;
    width: 500px;
    top: 500px;
  }
  .image-934 {
    height: 250px;
  }
  .image2 {
    width: 260px;
    height: 110.68px;
  }
  .frame-1171275099 {
    width: 210.53px;
    height: 100px;
    position: absolute;
    left: 350.24px;
    top: 209.99px;
  }
  .frame-1171275029 {
    left: 0px;
  }
  .frame-1171275030 {
    left: 0px;
  }
  .airui-intelligent-technology-shenzhen-co-ltd {
    margin-bottom: 25px;
  }
  .no-downloads-needed-use-airi-lab-seamlessly-across-devices-right-from-your-browser {
    width: 100%;
  }
  /* header---- */
  .header-css-659-c-1-v {
    padding: 10px 24px;
  }

  .frame-1171275066 {
    display: flex; /* Show navigation */
    gap: 16px;
  }

  .frame-1171275067 {
    gap: 10px;
  }

  .platform2 {
    font-size: 13px;
  }

  .header-cta,
  .header-cta2 {
    padding: 8px 14px;
  }

  .mobile-menu-button {
    display: none;
  }
  .frame-1171275027 {
    width: 100%;
  }

  .frame-1171274998 {
    width: 100%;
  }

  .frame-1171275027 {
    width: 100%;
  }

  .group-1171274978 {
    width: 100%;
  }

  .frame-1171274978 {
    width: 100%;
  }

  .rectangle-195788 {
    width: 100%;
  }

  .frame-1171274971 {
    padding: 60px 60px 80px 60px;
  }

  .ai-powered-design-tools-for-architects-designers-and-planners {
    font-size: 48px;
    line-height: 52px;
  }

  .streamline-your-workflow-with-powerful-ai-powered-image-generation-design-refinement-and-creative-exploration-built-by-architects-for-architects {
    font-size: 16px;
    line-height: 150%;
  }

  .frame-1171275028 {
    gap: 40px;
  }

  .frame-1171274969 {
    flex-direction: column;
    gap: 20px;
  }

  /* .cta-button {
    width: 100%;
  } */

  .frame-1171274978 {
    padding: 0px 60px;
    gap: 60px;
  }

  .frame-1171274972 {
    width: 100%;
    padding: 60px 80px 80px 80px;
  }

  .three-main-features {
    width: 100%;
    height: 500px;
  }

  .frame-1171274999 {
    flex-direction: column;
    gap: 16px;
    padding: 0px 20px 20px 0px;
  }

  .frame-1171275000 {
    width: 100%;
    padding: 0px 0px 20px 20px;
    max-width: 450px;
  }

  .smart-design-assistant {
    width: 100%;
    font-size: 20px;
    line-height: 24px;
  }

  .engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
    width: 100%;
    font-size: 14px;
  }

  .design-smarter-render-faster {
    font-size: 48px;
    line-height: 60px;
  }

  .ai-chat,
  .ai-chat3 {
    width: 140px;
    height: auto;
  }

  ._17483245257099,
  ._17483245837254,
  .div {
    height: 80px;
  }

  .frame-1171275043 {
    width: 100%;
  }

  .frame-1171275062 {
    width: 100%;
    padding: 0px 40px 0px 40px;
    flex-direction: column;
    gap: 60px;
  }

  .solution-by-role-cards {
    width: 100%;
    padding: 0px 40px 0px 40px;
    flex-direction: column;
    gap: 40px;
  }

  .group-1171274970 {
    width: 100%;
    max-width: 100%;
    height: 500px;
    position: relative;
    top: auto;
  }

  .rectangle-195772 {
    width: 100%;
    height: 500px;
  }

  .the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
    width: calc(100% - 64px);
    height: 400px;
    left: 32px;
  }

  .frame-1171275061 {
    width: 100%;
    gap: 40px;
  }

  .solutions-by-industry {
    width: 100%;
    font-size: 40px;
    line-height: 48px;
    text-align: center;
    margin-top: 75px;
  }

  .for-architects,
  .architects {
    font-size: 20px;
    line-height: 36px;
  }

  .bring-visionary-spaces-to-life-faster-with-ai-enhanced-ideation-iteration-and-visual-storytelling-so-you-can-focus-on-design-intent-while-airi-handles-the-visuals-variations-and-presentations {
    font-size: 16px;
    line-height: 20px;
  }

  .card-of-solution-by-role {
    padding: 30px 0px 30px 0px;
  }
  .rectangle-45 {
    top: 325px;
    left: 70px;
  }
  .rectangle-195774 {
    top: 343px;
    left: 85px;
  }

  .frame-1171274973 {
    width: 100%;
    padding: 80px 40px 80px 40px;
  }

  .frame-1171275018 {
    width: 100%;
    flex-direction: column;
    gap: 40px;
    align-items: center;
  }

  .render-with-airi-s-powerful-rendering-tools {
    width: 100%;
    font-size: 48px;
    line-height: 56px;
    text-align: center;
    display: flex;
    justify-content: center;
  }

  .feature-videos {
    width: 100%;
    height: 450px;
    position: relative;
  }

  .rectangle-195787 {
    width: 100%;
    height: 450px;
  }

  .frame-1171275026 {
    width: 100%;
    height: auto;
    position: static;
    transform: none;
    padding: 50px 25px;
    /* flex-direction: row; */
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
  }

  .powerful-toolkit {
    width: 100%;
    max-width: 300px;
    justify-content: center;
  }

  .inspire,
  .inspire2 {
    width: 100%;
    max-width: 272px;
    font-size: 20px;
    line-height: 32px;
    text-align: center;
  }
  .powerful-toolkit.selected .inspire,
  .powerful-toolkit.selected .inspire2 {
    color: #263238;
    font-size: 22px;
  }
  .frame-1171275017 {
    width: 100%;
    padding: 80px 20px;
    flex-direction: column;
    gap: 60px;
  }

  .frame-1171275063 {
    width: 100%;
    flex-direction: column-reverse;
    gap: 40px;
  }

  .frame-1171275016 {
    width: 100%;
    flex-direction: column;
    /* flex-wrap: wrap; */
    gap: 30px;
    /* justify-content: center; */
    align-items: center;
    right: 90px;
  }

  .frame-1171275011,
  .frame-1171275012,
  .frame-1171275014,
  .frame-1171275013 {
    width: calc(50% - 15px);
    min-width: 250px;
  }

  .image-container {
    /* width: 100%; */
    max-width: 985px;
    /* height: 400px; */
    margin: 0 auto;
  }

  ._500-000,
  ._2000,
  ._200,
  ._8-mp {
    font-size: 44px;
    line-height: 40px;
  }

  .customizable-templates,
  .typologies-and-styles,
  .ai-models,
  .crisp-output-resolution {
    font-size: 16px;
    line-height: 24px;
  }
  .frame-1171275011,
  .frame-1171275012,
  .frame-1171275014,
  .frame-1171275013 {
    width: calc(50% - 15px);
    min-width: 250px;
  }

  .frame-1171275044 {
    padding: 60px 80px 80px 80px;
  }
  .frame-1171275065 {
    width: 100%;
    max-width: 800px;
    justify-content: center;
  }
  .enterprise-grade-security-quality-outputs {
    font-size: 36px;
    line-height: 44px;
  }
  .enterprise-grade-security-and-an-llm-agnostic-architecture-prioritize-your-data-protection-privacy-while-providing-superior-quality-marketing-outputs {
    font-size: 20px;
    line-height: 28px;
  }

  .frame-1171275019 {
    padding: 50px 40px 40px 40px;
  }

  .create-anywhere-anytime {
    width: 100%;
    font-size: 48px;
    line-height: 64px;
  }

  .frame-11712749982 {
    width: 100%;
    height: 320px;
  }

  .frame-634995 {
    width: 100%;
    flex-direction: column;
    gap: 40px;
    align-items: center;
  }

  .frame-634994 {
    gap: 30px;
  }

  .airi-s-logo-04-1 {
    width: 100%;
    height: auto;
  }
  .vector-298 {
    width: 100%;
  }

  .frame-634972,
  .frame-6349722 {
    width: 100%;
    flex-direction: column;
    align-items: center;
  }

  .company-adress-room-1203-3-huanqiao-business-building-shahe-street-nanshan-district-shenzhen {
    width: 100%;
    margin-top: -60px;
  }

  .frame-634985 {
    width: 100%;
  }

  .contact-us-86-18165737937-airilab-com-contact-time-monday-to-friday-9-30-19-00 {
    width: 100%;
    text-align: center;
  }
}
@media screen and (min-width: 600px) and (max-width: 767px) {
  /* header---- */
  .avatar-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    right: 10px;
    background: white;
    border: 1px solid #ddd;
    border-radius: 8px;
    min-width: 180px;
    z-index: 1000;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    margin-top: 8px;
  }

  .avatar-dropdown.show {
    display: block;
    animation: fadeIn 0.2s ease;
  }

  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translateY(-10px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .avatar-dropdown-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    text-decoration: none;
    color: #333;
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
    font-family: "AlbertSans-Regular", sans-serif;
    font-size: 14px;
    font-weight: 400;
  }

  .avatar-dropdown-item:last-child {
    border-bottom: none;
  }

  .avatar-dropdown-item:hover {
    background-color: #d4d6d7;
    border-radius: 4px;
  }

  .avatar-dropdown-item:active {
    background-color: #e9ecef;
  }

  .avatar-dropdown-item.logout:hover {
    background-color: #d4d6d7;
    /* color: #dc3545; */
  }

  /* Icon container for dual state icons */
  .icon-container {
    width: 16px;
    height: 16px;
    position: relative;
    display: inline-block;
  }

  .icon-container img {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity 0.2s ease;
  }

  /* Default state - show default icon, hide active icon */
  .icon-container img.default {
    opacity: 1;
  }

  .icon-container img.active {
    opacity: 1;
  }

  /* Hover state - hide default icon, show active icon */
  .avatar-dropdown-item:hover .icon-container img.default {
    opacity: 1;
  }

  .avatar-dropdown-item:hover .icon-container img.active {
    opacity: 1;
  }

  /* Single icon (like logout) */
  .single-icon {
    width: 16px;
    height: 16px;
    opacity: 0.7;
    transition: opacity 0.2s ease;
  }

  .avatar-dropdown-item:hover .single-icon {
    opacity: 1;
  }
  .scroll_cont {
    left: 150px;
    width: 400px;
    top: 450px;
  }
  .header-css-659-c-1-v {
    padding: 10px 20px;
  }

  .frame-1171275066 {
    display: none;
  }

  .frame-1171275067 {
    gap: 10px;
  }

  .header-cta,
  .header-cta2 {
    padding: 8px 14px;
  }

  .try-airi-tools2,
  .sign-in {
    font-size: 13px;
  }
  .frame-1171274998 {
    width: 100%;
    top: 40px;
  }

  .frame-1171275027 {
    width: 100%;
  }

  .group-1171274978 {
    width: 100%;
  }

  .frame-1171274978 {
    width: 100%;
  }

  .rectangle-195788 {
    width: 100%;
  }

  .frame-1171274971 {
    padding: 40px 40px 60px 40px;
  }

  .ai-powered-design-tools-for-architects-designers-and-planners {
    font-size: 36px;
    line-height: 40px;
  }

  .streamline-your-workflow-with-powerful-ai-powered-image-generation-design-refinement-and-creative-exploration-built-by-architects-for-architects {
    font-size: 14px;
    line-height: 140%;
  }

  .frame-1171275028 {
    gap: 30px;
    margin-top: 100px;
  }

  .frame-1171274969 {
    flex-direction: column;
    gap: 16px;
  }

  /* .cta-button {
    width: 100%;
  } */

  .frame-635755 {
    padding: 6px 12px;
  }

  .all-in-one {
    font-size: 11px;
  }

  .frame-1171274978 {
    padding: 0px 40px;
    gap: 40px;
  }
  .frame-1171274972 {
    width: 100%;
    padding: 40px 40px 60px 40px;
  }

  .three-main-features {
    width: 100%;
    height: 400px;
  }

  .frame-1171274999 {
    flex-direction: column;
    gap: 12px;
    padding: 0px 15px 15px 0px;
  }

  .frame-1171275000 {
    width: 100%;
    padding: 0px 0px 15px 15px;
    max-width: 400px;
  }

  .smart-design-assistant {
    width: 100%;
    font-size: 18px;
    line-height: 22px;
  }

  .engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
    width: 100%;
    font-size: 14px;
  }

  .design-smarter-render-faster {
    font-size: 36px;
    line-height: 48px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 18px;
  }

  .ai-chat,
  .ai-chat3 {
    width: 120px;
    height: auto;
  }

  ._17483245257099,
  ._17483245837254,
  .div {
    height: 70px;
  }

  .ai-chat2,
  .ai-chat4 {
    font-size: 14px;
    line-height: 20px;
  }

  .frame-1171275043 {
    width: 100%;
  }

  .frame-1171275062 {
    width: 100%;
    padding: 0px 20px 0px 20px;
    flex-direction: column;
    gap: 40px;
  }

  .solution-by-role-cards {
    width: 100%;
    padding: 60px 20px 60px 20px;
    flex-direction: column;
    gap: 30px;
  }

  .group-1171274970 {
    width: 100%;
    height: 400px;
    position: relative;
    top: auto;
  }

  .rectangle-195772 {
    width: 100%;
    height: 400px;
  }

  .the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
    width: calc(100% - 40px);
    height: 360px;
    left: 20px;
    top: 20px;
  }

  .rectangle-45 {
    width: 250px;
    height: 140px;
    left: 40px;
    top: 320px;
  }

  .rectangle-195774 {
    width: 220px;
    height: 110px;
    left: 55px;
    top: 335px;
  }

  .frame-1171275061 {
    width: 100%;
    gap: 30px;
  }

  .solutions-by-industry {
    width: 100%;
    font-size: 32px;
    line-height: 40px;
    text-align: center;
    margin-top: 80px;
  }

  .for-architects,
  .architects {
    font-size: 18px;
    line-height: 32px;
  }

  .bring-visionary-spaces-to-life-faster-with-ai-enhanced-ideation-iteration-and-visual-storytelling-so-you-can-focus-on-design-intent-while-airi-handles-the-visuals-variations-and-presentations {
    font-size: 14px;
    line-height: 18px;
  }

  .card-of-solution-by-role {
    padding: 24px 0px 24px 0px;
  }

  .solution-for-architects {
    font-size: 14px;
  }
  .rectangle-45 {
    top: 250px;
    left: 45px;
  }
  .rectangle-195774 {
    top: 267px;
    left: 60px;
  }
  .powerful-toolkit.selected .inspire,
  .powerful-toolkit.selected .inspire2 {
    color: #263238;
    font-size: 22px;
  }
  .frame-1171274973 {
    width: 100%;
    padding: 60px 20px 60px 20px;
    gap: 40px;
  }

  .frame-1171275018 {
    /* width: 100%; */
    flex-direction: column;
    gap: 30px;
    align-items: center;
  }

  .render-with-airi-s-powerful-rendering-tools {
    width: 100%;
    font-size: 36px;
    line-height: 42px;
    text-align: center;
    display: flex;
    justify-content: center;
  }

  .feature-videos {
    width: 100%;
    height: 350px;
  }

  .rectangle-195787 {
    width: 100%;
    height: 350px;
  }

  .frame-1171275026 {
    width: 100%;
    height: auto;
    position: static;
    transform: none;
    padding: 15px;
    flex-direction: column;
    /* align-items: center; */
    gap: 15px;
    margin-top: 20px;
  }

  .powerful-toolkit {
    width: 100%;
    max-width: 280px;
    justify-content: center;
  }

  .inspire,
  .inspire2 {
    width: 100%;
    max-width: 252px;
    font-size: 14px;
    line-height: 28px;
    text-align: center;
  }
  .powerful-toolkit.selected .inspire2 {
    color: #263238;
    font-size: 18px;
  }

  .polygon-7,
  .polygon-72,
  .polygon-73,
  .polygon-74,
  .polygon-75,
  .polygon-76,
  .polygon-77 {
    width: 12px;
    height: 12px;
  }

  .frame-1171275017 {
    width: 100%;
    padding: 60px 20px;
    flex-direction: column;
    gap: 40px;
  }

  .frame-1171275063 {
    width: 100%;
    flex-direction: column-reverse;
    gap: 40px;
  }

  .frame-1171275016 {
    width: 100%;
    flex-direction: column;
    gap: 30px;
    /* align-items: center; */
  }

  .frame-1171275011,
  .frame-1171275012,
  .frame-1171275014,
  .frame-1171275013 {
    width: 100%;
    max-width: 400px;
    text-align: center;
  }

  .image-container {
    width: 100%;
    /* height: 350px; */
  }

  ._500-000,
  ._2000,
  ._200,
  ._8-mp {
    font-size: 36px;
    line-height: 32px;
    /* text-align: center; */
  }

  .customizable-templates,
  .typologies-and-styles,
  .ai-models,
  .crisp-output-resolution {
    font-size: 16px;
    line-height: 24px;
    /* text-align: center;
        justify-content: center; */
  }

  .frame-1171275044 {
    padding: 60px 80px 80px 80px;
  }
  .frame-1171275065 {
    width: 100%;
    max-width: 800px;
    justify-content: center;
  }
  .enterprise-grade-security-quality-outputs {
    font-size: 36px;
    line-height: 44px;
  }
  .enterprise-grade-security-and-an-llm-agnostic-architecture-prioritize-your-data-protection-privacy-while-providing-superior-quality-marketing-outputs {
    font-size: 20px;
    line-height: 28px;
    width: 556px;
  }

  .frame-1171275019 {
    padding: 40px 30px 30px 30px;
  }

  .create-anywhere-anytime {
    width: 100%;
    font-size: 36px;
    line-height: 48px;
  }

  .frame-11712749982 {
    width: 100%;
    height: 250px;
  }

  .frame-1171275072 {
    padding: 0px 0px 80px 0px;
    gap: 30px;
  }

  .frame-634995 {
    width: 100%;
    flex-direction: column;
    gap: 30px;
    align-items: center;
  }

  .frame-634994 {
    flex-direction: column;
    gap: 24px;
    align-items: center;
  }

  .airi-s-logo-04-1 {
    width: 100%;
    height: auto;
  }

  .vector-298 {
    width: 100%;
  }

  .frame-634972,
  .frame-6349722 {
    width: 100%;
    flex-direction: column;
    gap: 8px;
    align-items: center;
  }

  .company-adress-room-1203-3-huanqiao-business-building-shahe-street-nanshan-district-shenzhen {
    width: 100%;
    font-size: 12px;
    margin-top: -60px;
  }

  .frame-634985 {
    width: 100%;
  }

  .contact-us-86-18165737937-airilab-com-contact-time-monday-to-friday-9-30-19-00 {
    width: 100%;
    text-align: center;
    font-size: 12px;
  }
  .frame-1171275030 {
    left: 30.24px;
    top: 5.65px;
  }
  .frame-1171275099 {
    left: -2.76px;
    top: 146.99px;
    z-index: 9;
  }
  .cta-button {
    display: none;
  }
}

@media screen and (max-width: 599px) {
  .scroll_cont {
    left: 30px;
    width: 300px;
    top: 400px;
  }
  .image2 {
    width: 265px;
    height: 104px;
  }
  .frame-1171275030 {
    left: -5px;
    top: 2px;
  }

  .frame-1171274998 {
    width: 100%;
    top: 20px;
  }

  .frame-1171275027 {
    width: 100%;
  }

  .group-1171274978 {
    width: 100%;
  }

  .frame-1171274978 {
    width: 100%;
  }

  .rectangle-195788 {
    width: 100%;
  }

  .frame-1171274971 {
    padding: 30px 20px 50px 20px;
  }

  .ai-powered-design-tools-for-architects-designers-and-planners {
    font-size: 28px;
    line-height: 32px;
  }

  .streamline-your-workflow-with-powerful-ai-powered-image-generation-design-refinement-and-creative-exploration-built-by-architects-for-architects {
    font-size: 13px;
    line-height: 135%;
  }

  .frame-1171275028 {
    gap: 25px;
    margin-top: 100px;
  }

  .frame-1171274969 {
    flex-direction: column;
    gap: 12px;
  }

  /* .cta-button {
    width: 100%;
    height: 48px;
  } */

  .frame-6357552,
  .frame-6357553 {
    padding: 18px 32px;
  }

  .try-airi-tools,
  .talk-to-airi {
    font-size: 16px;
  }

  .frame-635755 {
    padding: 4px 10px;
  }

  .all-in-one {
    font-size: 10px;
  }

  .codicon-sparkle {
    width: 12px;
    height: 12px;
  }

  .frame-1171274978 {
    padding: 0px 20px;
    gap: 30px;
  }

  .image-logos,
  .image-logos2,
  .image-logos3,
  .image-logos4,
  .image-logos5,
  .image-logos6 {
    transform: scale(0.8);
  }

  .frame-1171274972 {
    width: 100%;
    padding: 30px 20px 40px 20px;
    gap: 60px;
  }

  .three-main-features {
    width: 100%;
    height: 350px;
  }

  .frame-1171274999 {
    flex-direction: column;
    gap: 8px;
    padding: 0px 10px 10px 0px;
  }

  .frame-1171275000 {
    width: 100%;
    padding: 0px 0px 10px 10px;
    max-width: 542px;
  }

  .smart-design-assistant {
    width: 100%;
    font-size: 16px;
    line-height: 20px;
  }

  .engage-description {
    font-size: 16px;
  }

  .engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
    width: 100%;
    font-size: 13px;
    line-height: 150%;
  }

  .design-smarter-render-faster {
    font-size: 28px;
    line-height: 36px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 16px;
    line-height: 150%;
  }

  .ai-chat,
  .ai-chat3 {
    width: 100px;
    height: auto;
  }

  ._17483245257099,
  ._17483245837254,
  .div {
    height: 60px;
  }

  .ai-chat2,
  .ai-chat4 {
    font-size: 12px;
    line-height: 18px;
  }

  .rectangle-195784 {
    height: 200px;
  }

  .frame-1171275043 {
    width: 100%;
  }

  .frame-1171275062 {
    width: 100%;
    padding: 40px 15px 40px 15px;
    flex-direction: column;
    gap: 30px;
  }

  .solution-by-role-cards {
    width: 100%;
    padding: 40px 15px 40px 15px;
    flex-direction: column;
    gap: 20px;
  }

  .group-1171274970 {
    width: 100%;
    height: 350px;
    position: relative;
    top: auto;
  }

  .rectangle-195772 {
    width: 100%;
    height: 350px;
  }

  .the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
    width: calc(100% - 30px);
    height: 320px;
    left: 15px;
    top: 15px;
  }

  .rectangle-45 {
    width: 200px;
    height: 120px;
    left: 30px;
    top: 223px;
  }

  .rectangle-195774 {
    width: 170px;
    height: 90px;
    left: 45px;
    top: 241px;
  }

  .frame-1171275061 {
    width: 100%;
    gap: 24px;
  }

  .solutions-by-industry {
    width: 100%;
    font-size: 28px;
    line-height: 34px;
    text-align: center;
    margin-top: 90px;
  }

  .for-architects,
  .architects {
    font-size: 16px;
    line-height: 28px;
  }

  .bring-visionary-spaces-to-life-faster-with-ai-enhanced-ideation-iteration-and-visual-storytelling-so-you-can-focus-on-design-intent-while-airi-handles-the-visuals-variations-and-presentations {
    font-size: 13px;
    line-height: 17px;
  }

  .card-of-solution-by-role {
    padding: 20px 0px 20px 0px;
    gap: 16px;
  }

  .solution-for-architects {
    font-size: 13px;
  }

  .cta-button2 {
    padding: 10px 20px;
    font-size: 14px;
  }

  .frame-1171274973 {
    width: 100%;
    padding: 40px 15px 40px 15px;
    gap: 30px;
  }

  .frame-1171275018 {
    width: 100%;
    flex-direction: column;
    gap: 20px;
    align-items: center;
  }

  .render-with-airi-s-powerful-rendering-tools {
    width: 100%;
    font-size: 28px;
    line-height: 34px;
    text-align: center;
    flex-direction: column;
  }

  .feature-videos {
    width: 100%;
    height: 280px;
  }

  .rectangle-195787 {
    width: 100%;
    height: 280px;
  }

  .frame-1171275026 {
    width: 100%;
    height: auto;
    position: static;
    transform: none;
    padding: 10px;
    flex-direction: column;
    /* align-items: center; */
    gap: 12px;
    margin-top: 20px;
  }
  .powerful-toolkit.selected .inspire,
  .powerful-toolkit.selected .inspire2 {
    color: #263238;
    font-size: 18px;
  }
  .powerful-toolkit {
    width: 100%;
    max-width: 250px;
    justify-content: center;
    gap: 10px;
  }

  .inspire,
  .inspire2 {
    width: 100%;
    max-width: 230px;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
  }

  .polygon-7,
  .polygon-72,
  .polygon-73,
  .polygon-74,
  .polygon-75,
  .polygon-76,
  .polygon-77 {
    width: 10px;
    height: 10px;
  }

  .frame-1171275017 {
    width: 100%;
    padding: 40px 15px;
    flex-direction: column;
    gap: 30px;
  }

  .frame-1171275063 {
    width: 100%;
    flex-direction: column-reverse;
    gap: 30px;
  }

  .frame-1171275016 {
    width: 100%;
    flex-direction: column;
    gap: 30px;
    justify-content: center;
  }

  .frame-1171275011,
  .frame-1171275012,
  .frame-1171275014,
  .frame-1171275013 {
    width: 100%;
    max-width: 400px;
    text-align: center;
  }

  .image-container {
    width: 100%;
    height: 380px;
  }

  ._500-000,
  ._2000,
  ._200,
  ._8-mp {
    font-size: 28px;
    line-height: 26px;
    /* text-align: center; */
  }

  .customizable-templates,
  .typologies-and-styles,
  .ai-models,
  .crisp-output-resolution {
    font-size: 14px;
    line-height: 20px;
    /* text-align: center;
        justify-content: center; */
    height: auto;
  }

  .frame-1171275044 {
    padding: 60px 40px 80px 40px;
  }
  .frame-1171275065 {
    width: 100%;
    max-width: 800px;
    justify-content: center;
  }
  .enterprise-grade-security-quality-outputs {
    font-size: 36px;
    line-height: 44px;
  }
  .frame-1171275057 {
    width: 100%;
  }
  .enterprise-grade-security-and-an-llm-agnostic-architecture-prioritize-your-data-protection-privacy-while-providing-superior-quality-marketing-outputs {
    font-size: 20px;
    line-height: 28px;
  }

  .frame-1171275019 {
    padding: 30px 20px 20px 20px;
  }

  .create-anywhere-anytime {
    width: 100%;
    font-size: 28px;
    line-height: 36px;
  }

  .frame-11712749982 {
    width: 49%;
    height: 200px;
  }

  .frame-1171275072 {
    padding: 0px 0px 60px 0px;
    gap: 24px;
  }

  .frame-634995 {
    width: 100%;
    flex-direction: column;
    gap: 24px;
    align-items: center;
  }

  .frame-634994 {
    flex-direction: column;
    gap: 20px;
    align-items: center;
  }

  .airi-s-logo-04-1 {
    width: 100%;
    height: auto;
  }

  .vector-298 {
    width: 100%;
  }

  .frame-634972,
  .frame-6349722 {
    width: 100%;
    flex-direction: column;
    gap: 6px;
    align-items: center;
  }

  .company-adress-room-1203-3-huanqiao-business-building-shahe-street-nanshan-district-shenzhen {
    width: 100%;
    font-size: 11px;
    margin-top: -50px;
  }

  .frame-634985 {
    width: 100%;
  }

  .contact-us-86-18165737937-airilab-com-contact-time-monday-to-friday-9-30-19-00 {
    width: 100%;
    text-align: center;
    font-size: 11px;
  }

  .frame-635049 {
    position: static;
    justify-content: center;
  }

  .group-634062 {
    width: 100%;
    height: auto;
  }
  .cta-button {
    display: none;
  }
}

/* Extra responsive adjustments */
@media screen and (max-width: 400px) {
  .frame-1171274998 {
    width: 100%;
  }

  .frame-1171275027 {
    width: 100%;
  }

  .group-1171274978 {
    width: 100%;
  }

  .frame-1171274978 {
    width: 100%;
  }

  .rectangle-195788 {
    width: 100%;
  }

  .ai-powered-design-tools-for-architects-designers-and-planners {
    font-size: 24px;
    line-height: 28px;
  }

  .streamline-your-workflow-with-powerful-ai-powered-image-generation-design-refinement-and-creative-exploration-built-by-architects-for-architects {
    font-size: 12px;
  }

  .frame-1171274971 {
    padding: 25px 15px 40px 15px;
  }

  .frame-1171274972 {
    width: 100%;
    padding: 20px 15px 30px 15px;
    gap: 40px;
  }

  .three-main-features {
    width: 100%;
    height: 300px;
  }

  .frame-1171274999 {
    flex-direction: column;
    gap: 6px;
    padding: 0px 8px 8px 0px;
  }

  .frame-1171275000 {
    width: 100%;
    padding: 0px 0px 8px 8px;
  }
  .cta-button {
    display: none;
  }
  .smart-design-assistant {
    width: 100%;
    font-size: 14px;
    line-height: 18px;
  }

  .engage-description {
    font-size: 14px;
  }

  .engage-in-natural-dialogue-with-an-ai-agent-that-understands-your-design-needs-extracts-key-concepts-and-styles-and-offers-tailored-creative-suggestions-instantly {
    width: 100%;
    font-size: 12px;
    line-height: 140%;
  }

  .design-smarter-render-faster {
    font-size: 24px;
    line-height: 30px;
  }

  .ai-tools-built-to-accelerate-your-workflow-from-concept-to-refined-rendering {
    font-size: 14px;
    line-height: 140%;
  }

  .ai-chat,
  .ai-chat3 {
    width: 80px;
    height: auto;
  }

  ._17483245257099,
  ._17483245837254,
  .div {
    height: 50px;
  }

  .ai-chat2,
  .ai-chat4 {
    font-size: 11px;
    line-height: 16px;
  }

  .rectangle-195784 {
    height: 180px;
  }

  .frame-1171275057 {
    gap: 16px;
  }

  .frame-1171275043 {
    width: 100%;
  }

  .frame-1171275062 {
    width: 100%;
    padding: 30px 10px 30px 10px;
    flex-direction: column;
    gap: 20px;
  }

  .solution-by-role-cards {
    width: 100%;
    padding: 30px 10px 30px 10px;
    flex-direction: column;
    gap: 15px;
  }

  .group-1171274970 {
    width: 100%;
    height: 300px;
    position: relative;
    top: auto;
  }

  .rectangle-195772 {
    width: 100%;
    height: 300px;
  }

  .the-architects-were-wearing-black-t-shirts-and-discussing-the-design-plans-together {
    width: calc(100% - 20px);
    height: 160px;
    left: 10px;
    top: 10px;
  }

  .rectangle-45 {
    width: 160px;
    height: 100px;
    left: 20px;
    top: 135px;
  }

  .rectangle-195774 {
    width: 140px;
    height: 80px;
    left: 30px;
    top: 146px;
  }

  .frame-1171275061 {
    width: 100%;
    gap: 20px;
  }

  .solutions-by-industry {
    width: 100%;
    font-size: 24px;
    line-height: 30px;
    text-align: center;
    letter-spacing: 1px;
  }

  .for-architects,
  .architects {
    font-size: 14px;
    line-height: 24px;
  }

  .bring-visionary-spaces-to-life-faster-with-ai-enhanced-ideation-iteration-and-visual-storytelling-so-you-can-focus-on-design-intent-while-airi-handles-the-visuals-variations-and-presentations {
    font-size: 12px;
    line-height: 16px;
  }

  .card-of-solution-by-role {
    padding: 16px 0px 16px 0px;
    gap: 12px;
  }

  .solution-for-architects {
    font-size: 12px;
  }

  .cta-button2 {
    padding: 8px 16px;
    font-size: 12px;
  }

  .view,
  .view2,
  .view3,
  .view4 {
    width: 20px;
    height: 20px;
  }

  .frame-1171274973 {
    width: 100%;
    padding: 30px 10px 30px 10px;
    gap: 20px;
  }

  .frame-1171275018 {
    width: 100%;
    flex-direction: column;
    gap: 15px;
    align-items: center;
  }

  .render-with-airi-s-powerful-rendering-tools {
    width: 100%;
    font-size: 24px;
    line-height: 30px;
    text-align: center;
  }

  .feature-videos {
    width: 100%;
    height: 220px;
  }

  .rectangle-195787 {
    width: 100%;
    height: 220px;
  }

  .frame-1171275026 {
    width: 100%;
    height: auto;
    position: static;
    transform: none;
    padding: 8px;
    flex-direction: column;
    /* align-items: center; */
    gap: 8px;
  }

  .powerful-toolkit {
    width: 100%;
    max-width: 200px;
    justify-content: center;
    gap: 8px;
  }

  .inspire,
  .inspire2 {
    width: 100%;
    max-width: 184px;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
  }

  .polygon-7,
  .polygon-72,
  .polygon-73,
  .polygon-74,
  .polygon-75,
  .polygon-76,
  .polygon-77 {
    width: 8px;
    height: 8px;
  }

  .arrow {
    width: 16px;
    height: 16px;
    bottom: -15px;
  }

  .frame-1171275017 {
    padding: 30px 10px;
    gap: 25px;
  }

  .frame-1171275016 {
    gap: 20px;
  }

  .frame-1171275011,
  .frame-1171275012,
  .frame-1171275014,
  .frame-1171275013 {
    padding: 12px;
  }

  .image-container {
    height: 250px;
  }

  ._500-000,
  ._2000,
  ._200,
  ._8-mp {
    font-size: 24px;
    line-height: 22px;
  }

  .customizable-templates,
  .typologies-and-styles,
  .ai-models,
  .crisp-output-resolution {
    font-size: 13px;
    line-height: 18px;
  }
  .frame-1171275044 {
    padding: 60px 40px 80px 40px;
  }
  .frame-1171275065 {
    width: 100%;
    /* max-width: 800px; */
    justify-content: center;
  }
  .enterprise-grade-security-quality-outputs {
    font-size: 36px;
    line-height: 44px;
  }
  .enterprise-grade-security-and-an-llm-agnostic-architecture-prioritize-your-data-protection-privacy-while-providing-superior-quality-marketing-outputs {
    font-size: 20px;
    line-height: 28px;
  }

  .frame-1171275019 {
    padding: 20px 15px 15px 15px;
  }

  .create-anywhere-anytime {
    width: 100%;
    font-size: 24px;
    line-height: 32px;
  }

  .frame-11712749982 {
    /* width: 100%; */
    height: 160px;
  }

  .frame-1171275072 {
    padding: 0px 0px 40px 0px;
    gap: 20px;
  }

  .frame-634995 {
    width: 100%;
    flex-direction: column;
    gap: 20px;
    align-items: center;
  }

  .frame-634994 {
    flex-direction: column;
    gap: 16px;
    align-items: center;
  }

  .airi-s-logo-04-1 {
    width: 100%;
    height: auto;
  }

  .vector-298 {
    width: 100%;
  }

  .frame-634972,
  .frame-6349722 {
    width: 100%;
    flex-direction: column;
    gap: 4px;
    text-align: center;
  }

  .company-adress-room-1203-3-huanqiao-business-building-shahe-street-nanshan-district-shenzhen {
    width: 100%;
    font-size: 10px;
  }

  .frame-634985 {
    width: 100%;
  }

  .contact-us-86-18165737937-airilab-com-contact-time-monday-to-friday-9-30-19-00 {
    width: 100%;
    text-align: center;
    font-size: 10px;
  }

  .airui-intelligent-technology-shenzhen-co-ltd,
  .copyright-2023-airi-lab,
  .guangdong-icp-no-17108204,
  .guangdong-public-security-bureau-no-44030002003609 {
    font-size: 10px;
  }

  .frame-635049 {
    position: static;
    justify-content: center;
    gap: 12px;
  }

  .group-634062 {
    width: 100%;
    height: auto;
  }
}
/* Additional utility classes for mobile navigation */
.mobile-nav {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  z-index: 1000;
}

.mobile-nav.active {
  display: block;
}

.mobile-nav .header-buttons {
  display: block;
  padding: 12px 20px;
  border-bottom: 1px solid #f0f0f0;
}

.mobile-nav .header-buttons:last-child {
  border-bottom: none;
}

@media screen and (max-width: 767px) {
  /* header---- */
  .mobile-menu-button {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  /* header---- */
  .mobile-nav {
    display: none !important;
  }
}