*{
      margin:0;
      padding:0;
      box-sizing:border-box;
    }

    body{
      background:#000;
      color:#fff;
      font-family:'Inter', sans-serif;
      overflow-x:hidden;
    }

    a{
      text-decoration:none;
      color:white;
    }

    /* =========================
       HEADER
    ==========================*/

    header{
      width:100%;
      padding:25px 70px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      border-bottom:1px solid rgba(255,255,255,0.04);
    }

    .logo{
      display:flex;
      align-items:center;
      gap:14px;
    }

    .logo-icon{
      width:42px;
      height:42px;
      border-radius:12px;
      border:2px solid #6b5cff;
      position:relative;
      display:flex;
      align-items:center;
      justify-content:center;
      font-weight:700;
      color:#ffffff;
    }

    .logo-icon::after{
      content:"";
      position:absolute;
      width:10px;
      height:10px;
      background:#00d9ff;
      border-radius:50%;
      bottom:-4px;
      right:-4px;
    }

    .logo-text{
      font-size:1.7rem;
      font-weight:800;
    }

    .logo-text span{
      background:linear-gradient(90deg,#42d9ff,#d100ff);
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }

    nav{
      display:flex;
      gap:50px;
    }

    nav a{
      font-weight:600;
      transition:0.3s;
    }

    nav a:hover{
      color:#bb66ff;
    }

    /* =========================
       HERO
    ==========================*/

    .hero, .sobre-nos{
      width:100%;
      min-height:85vh;
      padding:70px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:60px;
    }

    .hero-left{
      flex:1;
    }

    .hero-left h1{
      font-size:5rem;
      line-height:1.05;
      font-weight:800;
      margin-bottom:30px;
    }

    .gradient{
      background:linear-gradient(90deg,#55dfff,#7d7dff,#ff00ff);
      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }

    #title-center
    {
        display: block;
        width: 80%;
        height: auto;
        margin: 20px auto;
        text-align: center;
    }

    .hero-left p{
      color:#cfcfcf;
      font-size:1.3rem;
      line-height:1.8;
      max-width:700px;
      margin-bottom:40px;
    }

    .buttons{
      display:flex;
      gap:20px;
      flex-wrap:wrap;
    }

    .btn{
      padding:18px 34px;
      border-radius:14px;
      font-weight:700;
      font-size:1rem;
      transition:0.3s;
      border:none;
      cursor:pointer;
    }

    .btn-primary{
      background:linear-gradient(90deg,#2fdcff,#ff00ff);
      color:white;
      box-shadow:0 0 25px rgba(255,0,255,0.35);
    }

    .btn-primary:hover{
      transform:translateY(-3px);
      box-shadow:0 0 40px rgba(255,0,255,0.45);
    }

    .btn-secondary{
      background:transparent;
      border:1px solid #00d9ff;
      color:white;
    }

    .btn-secondary:hover{
      background:#00d9ff10;
      transform:translateY(-3px);
    }

    /* =========================
       IMAGE AREA
    ==========================*/

    .hero-right{
      flex:1;
      display:flex;
      justify-content:center;
      position:relative;
    }

    .image-box{
      width:100%;
      max-width:650px;
      border-radius:26px;
      overflow:hidden;
      position:relative;
      background:#111;
    }

    .image-box img{
      width:100%;
      display:block;
      filter:grayscale(100%);
    }

    .image-box::before{
      content:"";
      position:absolute;
      inset:0;
      background:linear-gradient(
        135deg,
        rgba(0,217,255,0.25),
        rgba(255,0,255,0.18)
      );
      z-index:2;
      pointer-events:none;
    }

    .image-box::after{
      content:"";
      position:absolute;
      inset:0;
      border:1px solid rgba(255,255,255,0.08);
      border-radius:26px;
      z-index:3;
      pointer-events:none;
    }

    /* =========================
       ANIMATION
    ==========================*/

    .fade-up{
      opacity:0;
      transform:translateY(40px);
      animation:fadeUp 1s ease forwards;
    }

    .delay{
      animation-delay:0.3s;
    }

    @keyframes fadeUp{
      to{
        opacity:1;
        transform:translateY(0);
      }
    }

    /* =========================
       RESPONSIVE
    ==========================*/

    @media(max-width:1100px){

      .hero{
        flex-direction:column;
        text-align:center;
      }

      .hero-left h1{
        font-size:3.8rem;
      }

      .hero-left p{
        margin:auto;
        margin-bottom:40px;
      }

      .buttons{
        justify-content:center;
      }

    }

    @media(max-width:768px){

      header{
        padding:25px 25px;
      }

      nav{
        display:none;
      }

      .hero{
        padding:40px 25px;
      }

      .hero-left h1{
        font-size:2.8rem;
      }

      .hero-left p{
        font-size:1rem;
      }

    }
    /* ===== SEÇÃO CLIENTES ===== */

.clientes{
    width:100%;
    padding:70px 20px;
    background:#020817;
    border-top:1px solid #0f172a;
    border-bottom:1px solid #0f172a;
}

.clientes h2{
    text-align:center;
    color:#cbd5e1;
    font-size:28px;
    margin-bottom:60px;
    letter-spacing:2px;
    font-weight:700;
}

/* CONTAINER DOS LOGOS */

.clientes-grid{
    max-width:1200px;
    margin:auto;

    display:flex;
    justify-content:center;
    align-items:center;
    gap:40px;

    flex-wrap:wrap;
}

/* CARD */

.logo-card{
    width:180px;
    height:90px;

    background:#111c2e;

    border:1px solid rgba(255,255,255,0.05);

    border-radius:14px;

    display:flex;
    justify-content:center;
    align-items:center;

    transition:0.3s ease;

    box-shadow:
    0 0 0 4px rgba(255,255,255,0.02),
    0 10px 30px rgba(0,0,0,0.3);
}

/* HOVER */

.logo-card:hover{
    transform:translateY(-5px);

    background:#16233b;

    box-shadow:
    0 0 0 4px rgba(255,255,255,0.03),
    0 15px 40px rgba(0,0,0,0.4);
}

/* IMAGEM */

.logo-card img{
    max-width:110px;
    max-height:50px;
    object-fit:contain;
    opacity:0.9;
}

/* RESPONSIVO */

@media(max-width:768px){

    .clientes h2{
        font-size:22px;
        margin-bottom:40px;
    }

    .clientes-grid{
        gap:20px;
    }

    .logo-card{
        width:140px;
        height:80px;
    }

    .logo-card img{
        max-width:90px;
    }

}

.cards-section{
    width:100%;
    padding:60px 20px;
}

.cards-grid{

    max-width:1300px;
    margin:auto;

    display:grid;

    grid-template-columns:
    repeat(auto-fit, minmax(350px,1fr));

    gap:30px;
}

/* CARD */

.card{

    background:#111827;

    border:1px solid rgba(255,255,255,0.05);

    border-radius:18px;

    padding:35px;

    transition:0.4s ease;

    position:relative;

    overflow:hidden;

    min-height:290px;
}

/* HOVER */

.card:hover{

    transform:translateY(-8px);

    border-color:#00d4ff;

    box-shadow:
    0 0 20px rgba(0,212,255,0.15);
}

#lilas:hover{

    transform:translateY(-8px);

    border-color:#c20078;

    box-shadow:
    0 0 20px rgba(0,212,255,0.15);
}

#red:hover{

    transform:translateY(-8px);

    border-color:#b9062d;

    box-shadow:
    0 0 20px rgba(0,212,255,0.15);
}

#green:hover{

    transform:translateY(-8px);

    border-color:#07df00;

    box-shadow:
    0 0 20px rgba(0,212,255,0.15);
}

#yellow:hover{

    transform:translateY(-8px);

    border-color:#fbff00;

    box-shadow:
    0 0 20px rgba(0,212,255,0.15);
}


#pink:hover{

    transform:translateY(-8px);

    border-color:#ff1fc7;

    box-shadow:
    0 0 20px rgba(0,212,255,0.15);
}
/* CARD ATIVO */

.card.active{

    border-color:#00d4ff;

    box-shadow:
    0 0 25px rgba(0,212,255,0.15);
}


/* ÍCONE */

.icon{

    width:64px;
    height:64px;

    border-radius:14px;

    display:flex;
    justify-content:center;
    align-items:center;

    margin-bottom:25px;

    font-size:26px;
}

/* CORES */

.blue{
    background:rgba(0,212,255,0.15);
    color:#00d4ff;
}

.purple{
    background:rgba(168,85,247,0.15);
    color:#c084fc;
}

.pink{
    background:rgba(236,72,153,0.15);
    color:#f472b6;
}

.green{
    background:rgba(34,197,94,0.15);
    color:#4ade80;
}

.yellow{
    background:rgba(250,204,21,0.15);
    color:#fde047;
}

.red{
    background:rgba(239,68,68,0.15);
    color:#f87171;
}

/* TÍTULO */

.card h3{

    font-size:34px;

    margin-bottom:18px;

    line-height:1.2;
}

/* TEXTO */

.card p{

    color:#94a3b8;

    font-size:18px;

    line-height:1.7;

    margin-bottom:30px;
}

/* TAGS */

.tags{

    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.tags span{

    padding:8px 14px;

    border-radius:999px;

    background:#1e293b;

    border:1px solid rgba(255,255,255,0.08);

    font-size:14px;

    color:#cbd5e1;
}

/* RESPONSIVO */

@media(max-width:768px){

    .cards-grid{
        grid-template-columns:1fr;
    }

    .card{
        padding:28px;
    }

    .card h3{
        font-size:28px;
    }

    .card p{
        font-size:16px;
    }

}

    .container-equipe{
      width:80%;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:50px;
      position:relative;
      margin:0 auto;
    }

    /* LEFT IMAGE */

    .left-side{
      position:relative;
      width:55%;
    }

    .image-box{
      width:100%;
      height:450px;
      overflow:hidden;
      border-radius:20px;
      position:relative;
    }

    .image-box img{
      width:100%;
      height:100%;
      object-fit:cover;
      filter:grayscale(100%) brightness(0.7);
      transition:0.5s;
    }

    .image-box:hover img{
      transform:scale(1.03);
      filter:grayscale(0%);
    }

    /* FLOATING GRADIENT SQUARE */

    .floating-card{
      width:140px;
      height:140px;
      border-radius:18px;

      background:linear-gradient(
        135deg,
        #00d2ff,
        #7b2ff7,
        #ff00c8
      );

      position:absolute;
      right:-30px;
      bottom:-30px;

      transform:rotate(12deg);

      backdrop-filter:blur(10px);

      box-shadow:
      0 0 30px rgba(138,43,226,.4);

      animation:float 4s ease-in-out infinite;
    }

    @keyframes float{
      0%{
        transform:rotate(12deg) translateY(0px);
      }

      50%{
        transform:rotate(12deg) translateY(-15px);
      }

      100%{
        transform:rotate(12deg) translateY(0px);
      }
    }

    /* RIGHT CONTENT */

    .right-side{
      width:45%;
    }
/*
    .logo{
      display:flex;
      align-items:center;
      gap:14px;
      margin-bottom:30px;
    }
*/
    .logo-icon{
      width:48px;
      height:48px;
      border:2px solid #7b2ff7;
      border-radius:12px;

      display:flex;
      align-items:center;
      justify-content:center;

      position:relative;
    }

    .logo-icon::after{
      content:'';
      width:12px;
      height:12px;
      background:#00d2ff;
      border-radius:50%;

      position:absolute;
      right:-6px;
      bottom:-6px;
    }

    .logo-icon span{
      font-size:30px;
      font-weight:bold;

      background:linear-gradient(
        90deg,
        #00d2ff,
        #ff00c8
      );

      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }
/*
    .logo h1{
      font-size:50px;
      font-weight:900;
      letter-spacing:-2px;
    }

    .logo h1 span{
      background:linear-gradient(
        90deg,
        #00d2ff,
        #ff00c8
      );

      -webkit-background-clip:text;
      -webkit-text-fill-color:transparent;
    }
*/
    .description{
      color:#bcbcbc;
      font-size:20px;
      line-height:1.7;
      margin-bottom:35px;
    }

    /* FEATURES */

    .features{
      display:flex;
      flex-direction:column;
      gap:22px;
      margin-bottom:40px;
    }

    .feature{
      display:flex;
      align-items:center;
      gap:18px;
      font-size:20px;
      font-weight:600;
    }

    .check{
      width:42px;
      height:42px;
      border-radius:12px;

      display:flex;
      align-items:center;
      justify-content:center;

      font-size:20px;
      font-weight:bold;

      color:white;
    }

    .cyan{
      background:rgba(0,210,255,.15);
      border:1px solid #00d2ff;
      box-shadow:0 0 20px rgba(0,210,255,.3);
    }

    .purple{
      background:rgba(123,47,247,.15);
      border:1px solid #7b2ff7;
      box-shadow:0 0 20px rgba(123,47,247,.3);
    }

    .pink{
      background:rgba(255,0,200,.15);
      border:1px solid #ff00c8;
      box-shadow:0 0 20px rgba(255,0,200,.3);
    }

    /* BUTTONS */

    .buttons{
      display:flex;
      gap:18px;
      margin-top:15px;
    }

 /*   .btn{
      padding:18px 35px;
      border-radius:14px;
      border:none;
      cursor:pointer;
      font-size:18px;
      font-weight:bold;
      transition:.3s;
    }
*/
    .primary{
      background:linear-gradient(
        90deg,
        #00d2ff,
        #ff00c8
      );

      color:white;

      box-shadow:
      0 0 25px rgba(255,0,200,.3);
    }

    .primary:hover{
      transform:translateY(-4px);
      box-shadow:
      0 0 40px rgba(255,0,200,.5);
    }

    .secondary{
      background:transparent;
      border:1px solid #444;
      color:white;
    }

    .secondary:hover{
      border-color:#00d2ff;
      color:#00d2ff;
    }

    /* RESPONSIVE */

    @media(max-width:1000px){

      body{
        padding:40px 20px;
      }

      .container-equipe{
        flex-direction:column;
      }

      .left-side,
      .right-side{
        width:100%;
      }
/*
      .logo h1{
        font-size:40px;
      }
*/
      .description{
        font-size:18px;
      }

      .feature{
        font-size:17px;
      }

      .buttons{
        flex-direction:column;
      }

      .btn{
        width:100%;
      }

      .floating-card{
        width:100px;
        height:100px;
        right:10px;
      }
    }

    /* ========================= */
/* PRICING SECTION */
/* ========================= */

.pricing-section{
    width: 100%;
    padding: 120px 8%;
    background:
    radial-gradient(circle at top left, rgba(0,255,255,.08), transparent 30%),
    radial-gradient(circle at top right, rgba(255,0,255,.08), transparent 30%),
    #050816;

    position: relative;
    overflow: hidden;
}

.pricing-header{
    text-align: center;
    margin-bottom: 70px;
}

.pricing-header h2{
    font-size: 52px;
    font-weight: 800;
    color: white;
    margin-bottom: 15px;
}

.pricing-header p{
    color: #94A3B8;
    font-size: 16px;
}

.pricing-grid{
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 30px;
    flex-wrap: wrap;
}

.pricing-card{
    width: 340px;
    padding: 40px 32px;
    border-radius: 24px;

    background: rgba(20,20,35,.75);

    border: 1px solid rgba(255,255,255,.08);

    backdrop-filter: blur(10px);

    position: relative;

    transition: .4s ease;

    box-shadow:
    0 0 40px rgba(0,0,0,.35);
}

.pricing-card:hover{
    transform: translateY(-10px);
}

.card-blue{
    background:
    linear-gradient(180deg,
    rgba(0,255,255,.10),
    rgba(168,85,247,.12));
}

.card-pink{
    background:
    linear-gradient(180deg,
    rgba(255,0,140,.12),
    rgba(0,255,255,.08));
}

.featured{
    border: 1px solid #ff00b8;

    transform: scale(1.04);

    box-shadow:
    0 0 30px rgba(255,0,184,.30);
}

.featured:hover{
    transform: scale(1.04) translateY(-10px);
}

.popular-badge{
    position: absolute;
    top: -14px;
    left: 50%;

    transform: translateX(-50%);

    background: linear-gradient(90deg,#ff00b8,#ff4fd8);

    color: white;

    font-size: 13px;
    font-weight: 700;

    padding: 8px 18px;

    border-radius: 999px;
}

.plan-icon{
    width: 58px;
    height: 58px;

    border-radius: 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
    linear-gradient(135deg,
    rgba(255,255,255,.12),
    rgba(255,255,255,.04));

    margin-bottom: 25px;
}

.plan-icon i{
    color: white;
    font-size: 22px;
}

.pricing-card h3{
    color: white;
    font-size: 30px;
    margin-bottom: 12px;
}

.plan-desc{
    color: #94A3B8;
    font-size: 14px;
    display: block;
    line-height: 1.6;
    margin-bottom: 30px;
}

.price{
    margin-bottom: 35px;
}

.price strong{
    font-size: 48px;
    color: white;
    font-weight: 800;
}

.price span{
    color: #94A3B8;
    font-size: 16px;
}

.features-list{
    list-style: none;
    padding: 0;
    margin-bottom: 35px;
}

.features-list li{
    color: #D7E1F0;
    margin-bottom: 16px;
    font-size: 15px;

    display: flex;
    align-items: center;
    gap: 12px;
}

.features-list i{
    color: #00F0FF;
}

.pricing-btn{
    width: 100%;
    height: 52px;

    border: none;
    border-radius: 12px;

    background: rgba(255,255,255,.08);

    color: white;
    font-weight: 700;

    cursor: pointer;

    transition: .3s ease;
}

.pricing-btn:hover{
    background: rgba(255,255,255,.16);
}

.active-btn{
    background:
    linear-gradient(90deg,
    #ff00b8,
    #ff4fd8);

    box-shadow:
    0 0 20px rgba(255,0,184,.35);
}

.active-btn:hover{
    filter: brightness(1.08);
}

.pricing-footer{
    margin-top: 60px;
    text-align: center;
}

.pricing-footer p{
    color: #94A3B8;
    margin-bottom: 10px;
}

.pricing-footer a{
    text-decoration: none;
    color: #00F0FF;
    font-weight: 600;
}

/* RESPONSIVO */

@media(max-width:1100px){

    .pricing-grid{
        flex-direction: column;
        align-items: center;
    }

    .featured{
        transform: scale(1);
    }

    .featured:hover{
        transform: translateY(-10px);
    }

}

@media(max-width:768px){

    .pricing-header h2{
        font-size: 38px;
    }

    .pricing-card{
        width: 100%;
    }

}

/* ========================= */
/* CONTACT SECTION */
/* ========================= */

.contact-section{
    width: 100%;
    padding: 120px 8% 80px;
    background: #000;
}

.contact-container{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 80px;
    flex-wrap: wrap;
}

/* LEFT */

.contact-left{
    flex: 1;
    min-width: 320px;
}

.contact-left h2{
    font-size: 52px;
    color: white;
    margin-bottom: 20px;
    font-weight: 800;
}

.contact-left p{
    color: #94A3B8;
    line-height: 1.7;
    margin-bottom: 40px;
    max-width: 520px;
}

.contact-item{
    display: flex;
    align-items: center;
    gap: 18px;

    margin-bottom: 24px;
}

.contact-icon{
    width: 48px;
    height: 48px;

    border-radius: 14px;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 18px;

    color: white;

    box-shadow:
    0 0 20px rgba(0,0,0,.25);
}

.contact-icon.cyan{
    background:
    linear-gradient(135deg,#00F0FF,#0088FF);
}

.contact-icon.purple{
    background:
    linear-gradient(135deg,#7B2FF7,#F107A3);
}

.contact-icon.pink{
    background:
    linear-gradient(135deg,#FF006E,#8338EC);
}

.contact-item span{
    display: block;
    color: #94A3B8;
    font-size: 14px;
    margin-bottom: 4px;
}

.contact-item strong{
    color: white;
    font-size: 15px;
    font-weight: 600;
}

.social-icons{
    display: flex;
    gap: 14px;
    margin-top: 35px;
}

.social-icons a{
    width: 42px;
    height: 42px;

    border-radius: 50%;

    background: rgba(255,255,255,.06);

    display: flex;
    align-items: center;
    justify-content: center;

    color: white;
    text-decoration: none;

    transition: .3s ease;
}

.social-icons a:hover{
    transform: translateY(-4px);

    background:
    linear-gradient(135deg,#00F0FF,#B026FF);
}

/* RIGHT */

.contact-right{
    flex: 1;
    display: flex;
    justify-content: center;
    min-width: 320px;
}

.whatsapp-box{
    width: 100%;
    max-width: 500px;

    padding: 50px;

    border-radius: 22px;

    background:
    linear-gradient(180deg,
    rgba(20,30,60,.95),
    rgba(10,18,35,.95));

    border: 1px solid rgba(255,255,255,.08);

    box-shadow:
    0 0 40px rgba(0,0,0,.35);

    text-align: center;
}

.whatsapp-box h3{
    color: white;
    font-size: 30px;
    margin-bottom: 20px;
}

.whatsapp-box p{
    color: #94A3B8;
    line-height: 1.7;
    margin-bottom: 35px;
}

.whatsapp-btn{
    border: none;

    padding: 18px 32px;

    border-radius: 14px;

    background:
    linear-gradient(90deg,#00D2FF,#B026FF);

    color: white;

    font-size: 16px;
    font-weight: 700;

    cursor: pointer;

    display: inline-flex;
    align-items: center;
    gap: 12px;

    transition: .3s ease;

    box-shadow:
    0 0 30px rgba(176,38,255,.35);
}

.whatsapp-btn:hover{
    transform: scale(1.04);
}

.whatsapp-box span{
    display: block;
    margin-top: 18px;
    color: #64748B;
    font-size: 14px;
}

/* ========================= */
/* FOOTER */
/* ========================= */

.footer{
    background:
    linear-gradient(90deg,
    #081224,
    #07152c);

    padding: 70px 8% 30px;

    border-top: 1px solid rgba(255,255,255,.06);
}

.footer-container{
    display: flex;
    justify-content: space-between;
    gap: 50px;
    flex-wrap: wrap;

    margin-bottom: 50px;
}

.footer-column{
    min-width: 220px;
}

.footer-logo{
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.footer-logo h2{
    color: white;
    font-size: 22px;
}

.footer-logo span{
    color: #ff00b8;
}

.footer-column p{
    color: #94A3B8;
    line-height: 1.7;
    max-width: 320px;
}

.footer-column h4{
    color: white;
    margin-bottom: 20px;
    font-size: 18px;
}

.footer-column a{
    display: block;

    margin-bottom: 14px;

    color: #94A3B8;

    text-decoration: none;

    transition: .3s ease;
}

.footer-column a:hover{
    color: #00F0FF;
}

.footer-social{
    display: flex;
    gap: 14px;
}

.footer-social a{
    width: 42px;
    height: 42px;

    border-radius: 50%;

    background: rgba(255,255,255,.06);

    display: flex;
    align-items: center;
    justify-content: center;

    color: white;

    transition: .3s ease;
}

.footer-social a:hover{
    background:
    linear-gradient(135deg,#00F0FF,#B026FF);

    transform: translateY(-4px);
}

/* BOTTOM */

.footer-bottom{
    border-top: 1px solid rgba(255,255,255,.08);

    padding-top: 25px;

    display: flex;
    justify-content: space-between;
    align-items: center;

    flex-wrap: wrap;
    gap: 20px;
}

.footer-bottom p{
    color: #64748B;
    font-size: 14px;
}

.footer-links{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.footer-links a{
    color: #64748B;
    text-decoration: none;
    font-size: 14px;

    transition: .3s ease;
}

.footer-links a:hover{
    color: #00F0FF;
}

/* ========================= */
/* RESPONSIVO */
/* ========================= */

@media(max-width:900px){

    .contact-container{
        flex-direction: column;
        align-items: flex-start;
    }

    .whatsapp-box{
        max-width: 100%;
    }

    .footer-container{
        flex-direction: column;
    }

    .footer-bottom{
        flex-direction: column;
        align-items: flex-start;
    }

}

@media(max-width:768px){

    .contact-left h2{
        font-size: 38px;
    }

    .whatsapp-box{
        padding: 35px;
    }

    .whatsapp-box h3{
        font-size: 24px;
    }

}