/* aqui consigo trabalhar */
:root {
  --ds-pypper-primary-color: #4bb794;
  --ds-pypper-primary-color-dark: #00B89C;
  --ds-pypper-secondary-color: #101828;
  /* background */ 
  --ds-pypper-background-main: white;
  --ds-color-main-dark: #164836;
  --ds-color-main-dark-hover: #195e45;
}

body {
  background-color: white;
  font-family: 'Inter', sans-serif;
  /* font-size: 62.5%; */
}

h1, h2, h3, h4, h5, h6, .title {
  
  font-family: 'Montserrat', sans-serif;
}

.fade-in {
  animation: fadeIn 0.8s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.logo-small {
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  font-size: 1rem;
  letter-spacing: 1px;
}

.logo-header {
  color: var(--ds-pypper-primary-color);
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
  font-size: 1.6rem;
  letter-spacing: 1px;
  max-width: 100px;
}

.has-color-primary {
  color: var(--ds-pypper-primary-color);
}

.has-background-primary {
  background-color: var(--ds-pypper-primary-color);
}

.hover:has-background-primary {
  background-color: var(--ds-pypper-primary-color-dark);
  transition: all .4 ease;
}

.has-background-secondary {
  background-color: var(--ds-pypper-secondary-color);
}

.card-service {
  background-color: var(--ds-pypper-secondary-color);
  color: white;
  font-weight: 300;
  cursor: pointer;
}
.card-service h4 {
  font-family: 'Inter', sans-serif;
}


.card-service:hover {
  background-color: white;
  color: var(--ds-pypper-primary-color);
  transition: all .2s ease-in;
}

.card-service_header {
  display: flex;
  justify-content: space-between;
}

#hero {
  margin-bottom: 120px;
}


#presentation img {
  max-width: 360px;
}

#presentation {
  background-color: var(--ds-pypper-secondary-color);
  background: linear-gradient(to right, var(--ds-pypper-secondary-color) 50%, rgba(0,0,0,.4) 100%), url('https://pypper.com.br/img/call-to-action-image.jpg');
  background-size: cover;      
  background-position: center;
  background-repeat: no-repeat;
}

#presentation .call-message {
  font-size: 1.8rem;
  font-weight: 600;
  font-family: 'Poppins', sans-serif;
}

.logo-bottom img {
  width: 180px;
}

.message #alert-contato-sucesso,
.message #alert-contato-erro {
  display: none;
}

textarea {
  resize: none;
}


/* plans */ 
.trust-card{

    position:relative;

    padding:60px;

    border-radius:28px;

    background:#FFF;

    border:1px solid #E8EDF3;

    box-shadow:
        0 1px 2px rgba(16,24,40,.04),
        0 10px 30px rgba(16,24,40,.06);

    overflow:hidden;

}

.trust-card::before{

    content:"";

    position:absolute;

    width:420px;
    height:420px;

    background:#22C55E22;

    filter:blur(120px);

    right:-180px;
    top:-180px;

    pointer-events:none;

}

.trust-badge{

    display:inline-flex;

    padding:8px 18px;

    border-radius:999px;

    background:#F0FDF4;

    color:#15803D;

    font-weight:600;

    font-size:.9rem;

}


.trust-item{

    text-align:center;

    padding:24px;

    border-radius:20px;

    transition:.25s;

}

.trust-item:hover{

    transform:translateY(-4px);

    background:#FAFAFA;

}

.icon-wrapper{

    width:64px;

    height:64px;

    margin:auto;

    border-radius:18px;

    display:flex;

    justify-content:center;

    align-items:center;

    background: #4bb794;
    color: white;

    border:1px solid #E5E7EB;

    box-shadow:
        0 8px 24px rgba(34,197,94,.10);

    margin-bottom:20px;

}

.trust-item h3{

    font-size:1.05rem;

    font-weight:700;

    color:#0F172A;

}

.trust-item p{

    margin-top:10px;

    color:#64748B;

    line-height:1.6;

    font-size:.95rem;

}

.trust-footer {

    margin-top:48px;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:10px;

    color:#475569;

    font-size:.95rem;

    border-top:1px solid #F1F5F9;

    padding-top:30px;

}