/* =========================
   COMPONENTS.CSS
========================= */

/* DIFERENCIAIS */
.diferencial-item{
    position:relative;
    min-height:100px;
    padding:20px 20px 18px;
    background:#ffffff;
    border:1px solid rgba(15,23,42,0.08);
    border-radius:14px;
    box-shadow:
        0 12px 24px rgba(15,23,42,0.10),
        0 3px 8px rgba(15,23,42,0.04);
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease,
        background 0.3s ease;
}

.diferencial-item::before{
    content:"";
    position:absolute;
    top:0;
    left:14px;
    right:14px;
    height:2px;
    width:auto;
    border-radius:999px;
    background:linear-gradient(90deg,var(--primary) 0%,var(--accent) 100%);
}

.diferencial-item:hover{
    transform:translateY(-6px);
    border-color:rgba(23,74,151,0.14);
    box-shadow:
        0 22px 42px rgba(15,23,42,0.18),
        0 8px 18px rgba(15,23,42,0.06);
    background:#ffffff;
}

.diferencial-item h3{
    font-size:0.98rem;
    margin-bottom:10px;
    color:var(--text-dark);
    font-weight:800;
    line-height:1.3;
}

.diferencial-item p{
    font-size:0.95rem;
    line-height:1.65;
    color:var(--text-light);
    margin:0;
}

/* IMAGEM SOBRE */
.imagem-placeholder{
    border-radius:var(--radius-md);
    background:linear-gradient(135deg,#dbe7f7 0%,#b8cde9 100%);
    color:var(--primary);
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    letter-spacing:0.08em;
    box-shadow:0 20px 42px rgba(15,23,42,0.10);
    overflow:hidden;
}

.imagem-placeholder img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* CARDS DE SERVIÇOS */
.servico-card-home{
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:320px;
    padding:28px 24px 22px;
    background:rgba(255,255,255,0.96);
    border:1px solid rgba(15,23,42,0.07);
    border-radius:var(--radius-md);
    box-shadow:
        0 14px 34px rgba(15,23,42,0.05),
        inset 0 1px 0 rgba(255,255,255,0.72);
    overflow:hidden;
    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}

.servico-card-home::before{
    content:"";
    position:absolute;
    inset:0 auto auto 0;
    width:100%;
    height:2px;
    background:linear-gradient(90deg,var(--primary) 0%,var(--accent) 100%);
}

.servico-card-home:hover{
    transform:translateY(-6px);
    border-color:rgba(23,74,151,0.15);
    box-shadow:
        0 22px 48px rgba(15,23,42,0.08),
        0 8px 18px rgba(15,23,42,0.04);
}

.servico-tag{
    display:inline-flex;
    width:max-content;
    margin-bottom:14px;
    padding:7px 12px;
    border-radius:999px;
    background:rgba(23,74,151,0.07);
    border:1px solid rgba(23,74,151,0.08);
    color:var(--primary);
    font-size:0.72rem;
    font-weight:800;
    letter-spacing:0.12em;
    text-transform:uppercase;
}

.servico-card-home h3{
    font-size:1.34rem;
    line-height:1.14;
    letter-spacing:-0.03em;
    min-height:52px;
    margin-bottom:12px;
    color:var(--text-dark);
    font-weight:800;
}

.card-img{
    width:100%;
    min-height:190px;
    margin:12px 0;
    border-radius:var(--radius-md);
    overflow:hidden;
    background:linear-gradient(135deg,#dbe7f7 0%,#b8cde9 100%);
    box-shadow:0 10px 24px rgba(15,23,42,0.06);
}

.card-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
}

.servico-card-home p{
    font-size:0.97rem;
    line-height:1.76;
    color:var(--text-light);
    margin-bottom:24px;
    flex-grow:1;
}

.servico-card-home .btn-servico{
    width:max-content;
    min-height:44px;
    padding:0 16px;
    font-size:0.74rem;
    border-radius:var(--radius-sm);
}

/* EQUIPE */
.equipe-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(420px, 1fr));
    gap:32px;
    width:100%;
}

.membro-card{
    display:flex;
    align-items:flex-start;
    gap:24px;
    max-width:100%;
    padding:28px;
    background:rgba(255,255,255,0.98);
    border:1px solid rgba(15,23,42,0.06);
    border-radius:var(--radius-md);
    box-shadow:0 12px 32px rgba(15,23,42,0.08);
    transition:all 0.3s ease;
    height:100%;
}

.membro-card:hover{
    transform:translateY(-8px);
    border-color:rgba(23,74,151,0.16);
    box-shadow:
        0 28px 56px rgba(15,23,42,0.14),
        0 10px 24px rgba(15,23,42,0.08);
}

.membro-foto{
    flex-shrink:0;
    width:160px;
    height:200px;
    border-radius:var(--radius-md);
    overflow:hidden;
    box-shadow:0 12px 32px rgba(15,23,42,0.10);
    position:relative;
    background:linear-gradient(135deg,#f1f5f9 0%,#e2e8f0 100%);
    transition:all 0.3s ease;
}

.membro-foto::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg, rgba(23,74,151,0.08) 0%, rgba(179,38,38,0.05) 100%);
    opacity:0;
    transition:opacity 0.3s ease;
    z-index:1;
}

.membro-foto:hover::before{
    opacity:1;
}

.membro-foto img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
    display:block;
    transition:transform 0.4s ease;
}

.membro-foto:hover img{
    transform:scale(1.08);
}

.membro-conteudo{
    flex:1;
    min-width:0;
}

.membro-card h3{
    color:var(--text-dark);
    margin:0 0 6px 0;
    font-size:1.32rem;
    line-height:1.25;
    letter-spacing:-0.025em;
    font-weight:900;
}

.membro-card span{
    display:block;
    color:var(--accent);
    font-weight:800;
    margin-bottom:10px;
    letter-spacing:0.06em;
    font-size:0.94rem;
    text-transform:uppercase;
}

.membro-card p{
    color:var(--text-light);
    line-height:1.75;
    font-size:0.98rem;
    margin:0;
}

/* PROJETOS / GALERIA */
.galeria-item{
    position:relative;
    min-height:260px;
    border-radius:var(--radius-md);
    background:linear-gradient(135deg,#dce8ff 0%,#bfd3f8 100%);
    color:var(--primary);
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    padding:20px;
    font-weight:800;
    letter-spacing:0.04em;
    box-shadow:0 12px 28px rgba(15,23,42,0.06);
    border:1px solid rgba(15,23,42,0.06);
    overflow:hidden;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}

.galeria-item:hover{
    transform:translateY(-5px);
    box-shadow:0 20px 38px rgba(15,23,42,0.10);
    border-color:rgba(23,74,151,0.14);
}

.galeria-item img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    z-index:1;
}

.galeria-item::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:2;
    background:linear-gradient(180deg, rgba(15,23,42,0.06) 0%, rgba(15,23,42,0.58) 100%);
}

.galeria-item span,
.galeria-item strong{
    position:relative;
    z-index:3;
    color:var(--white);
    font-size:1rem;
    line-height:1.35;
}

/* CONTATO */
.contato-box{
    background:linear-gradient(135deg,#0b1422 0%,#123054 100%);
    color:var(--white);
    border-radius:var(--radius-md);
    padding:32px;
    box-shadow:0 20px 40px rgba(15,23,42,0.14);
    border:1px solid rgba(255,255,255,0.08);
}

.contato-box h2,
.contato-box h3{
    color:var(--white);
    font-size:clamp(2rem,4vw,3rem);
    line-height:1.02;
    letter-spacing:-0.03em;
    font-weight:900;
    margin-bottom:18px;
}

.contato-box p{
    font-size:1rem;
    line-height:1.8;
    color:rgba(255,255,255,0.84);
    margin:12px 0;
}

.contato-box a{
    color:var(--white);
    font-weight:700;
}

.contato-box a:hover{
    color:var(--accent);
}

.form-contato{
    background:rgba(255,255,255,0.98);
    border:1px solid rgba(15,23,42,0.08);
    border-radius:var(--radius-md);
    padding:24px;
    box-shadow:0 12px 28px rgba(15,23,42,0.05);
}

.form-contato textarea{
    margin-bottom:14px;
}

.form-contato button{
    width:max-content;
}

/* UPLOAD */
.upload-tag{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin-top:10px;
    margin-bottom:14px;
    padding:10px 0 4px;
}

.upload-botao{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:42px;
    padding:0 16px;
    border-radius:999px;
    border:1px solid rgba(23,74,151,0.16);
    background:rgba(23,74,151,0.08);
    color:var(--primary);
    font-size:0.84rem;
    font-weight:700;
    cursor:pointer;
    transition:
        background 0.25s ease,
        color 0.25s ease,
        transform 0.25s ease,
        border-color 0.25s ease;
}

.upload-botao i{
    font-size:0.95rem;
}

.upload-botao:hover{
    background:var(--primary);
    color:var(--white);
    border-color:var(--primary);
    transform:translateY(-1px);
}

.upload-tag input{
    display:none;
}

.upload-nome{
    font-size:0.84rem;
    color:var(--text-soft);
    line-height:1.5;
    word-break:break-word;
}

/* WHATSAPP */
.whatsapp-float{
    position:fixed;
    right:28px;
    bottom:28px;
    z-index:120;
    display:flex;
    align-items:center;
    justify-content:center;
    width:58px;
    height:58px;
    border-radius:999px;
    background:#25d366;
    color:#fff;
    text-decoration:none;
    box-shadow:0 10px 24px rgba(37,211,102,0.28);
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        opacity 0.3s ease;
}

.whatsapp-float:hover{
    transform:translateY(-4px) scale(1.04);
    box-shadow:0 16px 30px rgba(37,211,102,0.34);
}

.whatsapp-float i{
    font-size:28px;
    position:relative;
    z-index:1;
}

.whatsapp-badge{
    position:absolute;
    right:72px;
    padding:8px 14px;
    border-radius:8px;
    background:rgba(255,255,255,0.94);
    color:var(--text-dark);
    font-size:0.84rem;
    font-weight:700;
    white-space:nowrap;
    box-shadow:0 8px 20px rgba(0,0,0,0.10);
    opacity:0;
    transform:translateX(14px);
    transition:opacity 0.3s ease, transform 0.3s ease;
    pointer-events:none;
}

.whatsapp-float:hover .whatsapp-badge{
    opacity:1;
    transform:translateX(0);
}

/* AJUSTES RESPONSIVOS DO COMPONENTS */
@media (max-width:768px){
    .membro-card{
        flex-direction:column;
        align-items:center;
        text-align:center;
        padding:24px;
    }

    .membro-foto{
        width:140px;
        height:180px;
        margin-bottom:16px;
    }

    .equipe-grid{
        grid-template-columns:1fr;
        gap:24px;
    }

    .galeria-item{
        min-height:220px;
    }
}

@media (max-width:480px){
    .membro-card{
        padding:20px;
    }

    .membro-foto{
        width:120px;
        height:160px;
    }

    .galeria-item{
        min-height:200px;
        padding:16px;
    }
}
/* LISTA DE ESPECIALIZAÇÕES */
.especializacoes-lista{

    margin-top:14px;

    display:grid;

    gap:8px;

    padding-left:0;

    list-style:none;
}

.especializacoes-lista li{

    position:relative;

    padding-left:18px;

    font-size:0.95rem;

    color:var(--text-light);

    line-height:1.6;
}

/* marcador elegante */
.especializacoes-lista li::before{

    content:"";

    position:absolute;

    left:0;

    top:8px;

    width:6px;

    height:6px;

    border-radius:50%;

    background:var(--accent); /* vermelho */

    box-shadow:0 0 0 3px rgba(179,38,38,0.12);
}