/* ===================================
   ESTILO GERAL
=================================== */

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

html{
    scroll-behavior:smooth;
}

body{

    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background:#f8f9fa;
    color:#333;
    line-height:1.6;

}


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

.hero{

    min-height:100vh;
    display:flex;
    align-items:center;

    background:linear-gradient(135deg,#ffffff 0%,#eef5fb 100%);

}


/* ===================================
   FOTO
=================================== */

.foto-perfil{

    width:320px;
    height:320px;

    object-fit:cover;

    border-radius:50%;

    border:8px solid #ffffff;

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

    transition:.4s;

}

.foto-perfil:hover{

    transform:scale(1.03);

}


/* ===================================
   TEXTOS
=================================== */

h5{

    color:#0078D4;

    font-weight:600;

    margin-bottom:10px;

}

h1{

    font-size:3.5rem;

    font-weight:700;

    color:#222;

    margin-bottom:10px;

}

h3{

    color:#555;

    font-weight:400;

    margin-bottom:25px;

}

p{

    font-size:1.15rem;

    color:#666;

    max-width:700px;

}


/* ===================================
   BOTÕES
=================================== */

.btn{

    padding:12px 30px;

    border-radius:50px;

    font-weight:600;

    transition:.3s;

}

.btn-primary{

    background:#0078D4;

    border:none;

}

.btn-primary:hover{

    background:#005EA6;

    transform:translateY(-2px);

}

.btn-outline-primary{

    border:2px solid #0078D4;

    color:#0078D4;

}

.btn-outline-primary:hover{

    background:#0078D4;

    color:#FFF;

}


/* ===================================
   ÍCONES
=================================== */

.tech{

    font-size:2.2rem;

    color:#0078D4;

    margin-right:18px;

    transition:.3s;

}

.tech:hover{

    color:#005EA6;

    transform:translateY(-5px);

}


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

@media(max-width:991px){

    .hero{

        text-align:center;

        padding:60px 20px;

    }

    .foto-perfil{

        width:440px;
        height:440px;

        margin-bottom:40px;

    }

    h1{

        font-size:2.6rem;

    }

    h3{

        font-size:1.4rem;

    }

    p{

        font-size:1rem;

        margin:auto;

    }

    .btn{

        width:100%;

        margin-bottom:15px;

    }

    .tech{

        font-size:2rem;

        margin:10px;

    }

}

.btn-whatsapp{

    background:#25D366;
    color:#FFF;
    border:2px solid #25D366;

}

.btn-whatsapp:hover{

    background:#1EBE5D;
    border-color:#1EBE5D;
    color:#FFF;

}

.service-item{
    background:#ffffff;
    border-radius:12px;
    padding:14px 18px;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
    font-weight:600;
    transition:.3s;
}

.service-item:hover{
    transform:translateY(-4px);
    box-shadow:0 10px 25px rgba(0,0,0,.12);
}

.service-item i{
    width:24px;
}