html, body {
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

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;
}

.cont,
.cont * {
  box-sizing: border-box;
}

.cont {
  background: var(--bg-main, #ffffff);
  min-height: 100vh;
  position: relative;
  overflow: hidden;
}

.main-content {
  display: flex;
  flex-direction: column;
  gap: 48px;
  align-items: flex-start;
  justify-content: center;
  width: 495px;
  height: 100vh;
  position: absolute;
  left: 176px;
  top: 0;
}

.cnib {
  flex-shrink: 0;
  width: 121px;
  height: 40px;
  position: relative;
}

.button:hover {
  color: #5c7dff; 
}

.camada-2 {
  height: auto;
  position: absolute;
  left: 0;
  top: 0;
  overflow: visible;
  aspect-ratio: 121/40;
}

.frame-a,
.frame-b,
.frame-c,
.text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}

.frame-a {
  gap: 96px;
}

.frame-b {
  gap: 32px;
}

.frame-c,
.text {
  gap: 16px;
}

.acesse {
  color: var(--fg-main, #0f1113);
  text-align: left;
  font-family: var(--titles-heading-strong-font-family, "OpenSans-SemiBold", sans-serif);
  font-size: var(--titles-heading-strong-font-size, 24px);
  line-height: var(--titles-heading-strong-line-height, 28px);
  letter-spacing: var(--titles-heading-strong-letter-spacing, -0.5px);
  font-weight: var(--titles-heading-strong-font-weight, 600);
  position: relative;
  width: 100%;
}

.text-aling {
  color: var(--fg-main, #0f1113);
  text-align: left;
  font-family: "-", sans-serif;
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}

.text-span {
  font-family: var(--body-soft-font-family, "OpenSans-Regular", sans-serif);
  font-size: var(--body-soft-font-size, 16px);
  line-height: var(--body-soft-line-height, 28px);
  font-weight: var(--body-soft-font-weight, 400);
}

.text-span-3 {
  font-family: var(--body-strong-font-family, "OpenSans-Bold", sans-serif);
  font-size: var(--body-strong-font-size, 16px);
  line-height: var(--body-strong-line-height, 28px);
  font-weight: var(--body-strong-font-weight, 700);
}

.actions {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  flex-wrap: wrap;
}

.link-button {
  border-radius: 8px;
  padding: var(--space-nudge, 2px) var(--space-none, 0px);
  display: flex;
  flex-direction: row;
  gap: var(--space-smallest, 4px);
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}

.label {
  display: flex;
  flex-direction: row;
  gap: var(--space-none, 0px);
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}

.button {
  color: var(--fg-expressive-blue-soft, #3761f6);
  text-align: left;
  font-family: var(--labels-strong-font-family, "OpenSans-SemiBold", sans-serif);
  font-size: var(--labels-strong-font-size, 16px);
  line-height: var(--labels-strong-line-height, 20px);
  font-weight: var(--labels-strong-font-weight, 600);
  position: relative;
}

.text-time {
  color: var(--fg-main, #0f1113);
  text-align: left;
  font-family: var(--body-small-strong-font-family, "OpenSans-SemiBold", sans-serif);
  font-size: var(--body-small-strong-font-size, 14px);
  line-height: var(--body-small-strong-line-height, 20px);
  font-weight: var(--body-small-strong-font-weight, 600);
  position: relative;
  align-self: stretch;
}

.frame-op {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}

.operado-por {
  color: var(--fg-main, #0f1113);
  text-align: left;
  font-family: var(--body-smaller-font-family, "OpenSans-Regular", sans-serif);
  font-size: var(--body-smaller-font-size, 12px);
  line-height: var(--body-smaller-line-height, 18px);
  font-weight: var(--body-smaller-font-weight, 400);
  position: relative;
  width: 79px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.header-logos {
  padding: 1.6px 0;
  display: flex;
  flex-direction: column;
  gap: 3.2px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  height: 16px;
  position: relative;
  overflow: hidden;
}

.onr-logo {
  flex-shrink: 0;
  width: 94.4px;
  height: 12.8px;
  position: relative;
  overflow: hidden;
}

.logos {
  height: auto;
  position: absolute;
  left: 0;
  top: 0;
  overflow: visible;
}

.frame {
  position: fixed;
  top: 0;
  right: 0;
  height: 100vh;            
  width: auto;                 
  max-width: 100vw;           
  opacity: 0.05;
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
}

.clip-path-group {
  position: relative;
  height: 100%;
  width: auto;
  display: block;
}

/* Responsivo: Ajuste de conteúdo lateral */
@media (max-width: 1024px) {
  .main-content {
    position: relative;
    left: 0;
    padding: 16px;
  }
}

/* Esconde o frame em telas menores */
@media (max-width: 900px) {
  .frame {
    display: none;
  }
}