/* @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); */

:root {
    --cartao-violeta: #241E33;
    --luz-ambar: #ffc867;
    --creme-luz: #fff3d6;
    --alvo: #fbfaf8;
    --breu: #171225;
}

/* Fundo roxo escuro unificado para Header e Hero */
.background-purple {
    background-color: var(--cartao-violeta) ;
}

/* Cor amarela do tema */
.bg-amber {
    background-color: var(--luz-ambar) ;
}

/* Arredondamento de 52px igual ao Figma */
.rounded-top-5 {
    border-top-left-radius: 52px ;
    border-top-right-radius: 52px ;
}

.rounded-bottom-5 {
    border-bottom-left-radius: 52px ;
    border-bottom-right-radius: 52px ;
}

body {
    font-family: 'Poppins', sans-serif;
    background-color: var(--alvo);
}

/* ==================== HEADER ==================== */
.logo__sun {
    max-height: 38px;
    width: auto;
}
.site-header{
    background-color:var(--cartao-violeta);
    margin-left: 2%;
    margin-right: 2%;
    padding-bottom: 2px;
}
.main-nav__link {
    color: var(--alvo);
    transition: opacity 0.2s ease;
}

.main-nav__link:hover {
    opacity: 1 ;
}

.site-header__actions .btn--primary {
    color: var(--breu);
    background-color: var(--luz-ambar);
    border: none;
    font-weight: 600px;
}

/* ==================== HERO ==================== */
.hero {
    color: var(--alvo);
    background-color: var(--cartao-violeta);
    margin-left: 2%;
    margin-right: 2%;
}

/* Posicionamento da Badge */                               /* Essa parte está quebrando a responsividade */
.badge-wrapper {
  position: absolute;
  left: 90%;
  top: -30%; /* Ajuste a altura vertical conforme necessário */
  transform: translateX(-50%);  /* trava a posição máxima do elemento a 50% da tela */
}

.hero__title {
    letter-spacing: -2px;
    line-height: 1.05;
}

.hero__title .accent-dot {
    color: var(--luz-ambar);
}

.badge__icon {
    width: 18px;
    height: 18px;
    font-size: 11px;
}

.hero__ctas .btn--primary {
    background-color: var(--luz-ambar);
    color: var(--breu);
    border: none;
}

.hero__ctas .btn--outline {
    color: var(--alvo);
    border: 1px solid rgba(251, 250, 248, 0.4);
    background: transparent;
}

.hero__ctas .btn--outline:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--alvo);
}



.floating-chip {
    background-color: var(--breu);
    bottom: -10px;
    left: 20px;
    width: 220px;
    z-index: 10;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.dot-bullet {
    width: 6px;
    height: 6px;
    display: inline-block;
}

.hero__ghost-text {
    font-size: 18vw;
    line-height: 0.75;
    color: var(--alvo);
    opacity: 0.03;
    pointer-events: none;
    z-index: 0;
}

#image_header {
    max-width: 100%;
    height: auto;
}

/* Produto */
.values {
    background-color:var(--creme-luz);
    border-radius: 52px 52px;
    margin: 2% 0;
}

.value-section__tag {
    color: #7b7b7b;
    padding-top: 2%;
}

.value-card {
    display: flex;
    background-color: var(--alvo);
    border-radius: 29px;
    
}

.section-tag {
    color: #7b7b7b;
}


/*FOOTER*/
.site-footer-card {
  background-color: var(--cartao-violeta);
  border-radius: 52px;
}

/* Estilização padrão para os links do rodapé */
.footer-link {
  color: var(--alvo);
  text-decoration: none; /* Remove o sublinhado */
  font-size: 18px;
}

#footer-img{
    max-width: 100%;
}

/* -----------------SECTION 2---------------------- */

.process {
    position: relative;
    overflow: hidden;
    margin-top: 28px;
    background-color: var(--cartao-violeta);
    color: var(--alvo);
    border-radius: 32px;
    margin-bottom: 20px;
}

.process__inner {
    position: relative;
    padding: 42px 0 45px;

}

.section-tag--dark {
    color: var(--luz-ambar);
}

.section-tag--light {
    color: var(--alvo);
    max-width: 650px;
}

.process__steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 30px;
    margin-top: 70px;
    list-style: none;
}

.process-step__number {
    position: relative;
    z-index: 1;
    display: grid;
    width: 40px;
    height: 40px;
    font: 600 14px/1;
    place-items: center;
    background-color: var(--breu);
    border: 1px solid var(--luz-ambar);
    border-radius: 50%;
    border-color: var(--luz-ambar);
    
}

.process-step {
    position: relative;
}
.process-step:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 50px;
  right: -200px;
  top: 19px;
  border-top: 1px dashed var(--creme-luz);
  opacity: 20%;
}

.section-title--light {
    font-weight: bold;
    font-size: 65px;
    max-width: 962px;
    
}

.process__ghost-text {
    color: var(--alvo);
    position: absolute;
    right: 45px;
    top: 18px;
    margin: 0;
    font: 800 210px/1 "Poppins", sans-serif;
    opacity: 5%;
    letter-spacing: -6px;

}

.process-step__title {
    font-weight: bold;
}

.process-step p {
    opacity: 20%;
    font-weight: 200;
    max-width: 200px;
    margin: 0;
}

.process-step__title {
    margin-top: 30px;
}

.section-tag--dark {
    color: var(--luz-ambar);
}