/* ═══════════════════════════════════════════
   HFGitec — Estilos personalizados
   (regras que vão além do Tailwind CDN)
═══════════════════════════════════════════ */

body { background: #f5f2e9; color: #1C2F4A; }

/* Evita flash de link azul/sublinhado antes do Tailwind (CDN) carregar */
a { color: inherit; text-decoration: none; }

/* Overlay levíssimo bege/creme sobre toda a página */
body::after {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(245, 238, 220, 0.12);
    pointer-events: none;
    z-index: 9999;
}

/* Linha dourada acima dos case-cards */
.case-card::before {
    content: '';
    display: block;
    height: 3px;
    background: linear-gradient(90deg, #B8892A, #E5C483);
    border-radius: 12px 12px 0 0;
    margin: -1px -1px 0;   /* cobre a borda do topo */
}

/* Hover sutil nos cards de serviço */
.svc-card:hover { box-shadow: 0 4px 20px rgba(28,47,74,0.08); }

/* Scrollbar discreta */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f7f4ee; }
::-webkit-scrollbar-thumb { background: #c8dff0; border-radius: 3px; }


/* Degradê que esconde a imagem do hero por trás do texto —
   no celular recua mais (fica visível só na metade direita) pra não brigar com o título */
.hero-fade-x {
    position: absolute;
    inset: 0;
    background: linear-gradient(to right, #faf8f2 0%, #faf8f2 8%, transparent 38%);
}

@media (max-width: 767px) {
    .hero-fade-x {
        background: linear-gradient(to right, #faf8f2 0%, #faf8f2 20%, transparent 68%);
    }
}

/* Botão flutuante do WhatsApp */
.whatsapp-float {
    position: fixed;
    bottom: 28px;
    /* Usamos "left" calculado em vez de "right": alguns navegadores mobile
       (Android WebView mais antigos) não posicionam corretamente "right" em
       elementos fixed. "left" é muito mais confiável entre navegadores. */
    left: calc(100% - 58px - 32px);
    width: 58px;
    height: 58px;
    background: #25D366;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0,0,0,0.25);
    z-index: 9998;
    transition: box-shadow 0.2s ease;
}

.whatsapp-float svg {
    width: 30px;
    height: 30px;
}

@media (max-width: 767px) {
    .whatsapp-float {
        width: 64px;
        height: 64px;
        bottom: 24px;
        left: calc(100% - 64px - 20px);
        box-shadow: 0 4px 18px rgba(0,0,0,0.35);
    }
    .whatsapp-float svg {
        width: 34px;
        height: 34px;
    }
}

.whatsapp-float:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 20px rgba(0,0,0,0.28);
}