/* =====================================================
   Festa em Casa — Identidade Visual
   ===================================================== */

:root {
  --color-creme:  #FDF8F3;
  --color-areia:  #F0E8DC;
  --color-cacau:  #2C2118;
  --color-terra:  #D4825A;
  --color-sage:   #C8DFC6;
  --color-azul:   #B8D8E8;
  --color-muted:  #7A5C4A;
  --color-light:  #A07060;
}

/* Fundo geral */
body { background-color: var(--color-creme) !important; color: var(--color-cacau) !important; }

/* Navbar */
.theme-main-menu { background-color: var(--color-creme) !important; }
.theme-main-menu .nav-link { color: var(--color-cacau) !important; }
.theme-main-menu .nav-link:hover,
.theme-main-menu .nav-link.active { color: var(--color-terra) !important; }

/* Hambúrguer */
.navbar-toggler { background-color: var(--color-terra) !important; border-color: var(--color-terra) !important; }
.navbar-toggler span,
.navbar-toggler span::before,
.navbar-toggler span::after { background-color: #fff !important; }

/* Hero */
.hero-banner-six { background-color: var(--color-areia) !important; }
.hero-heading { color: var(--color-cacau) !important; }

/* ---- Hero cards ---- */
/* box-one: verde neon → sage */
.hero-banner-six .wrapper .box-one { background: var(--color-sage) !important; }
.hero-banner-six .wrapper .box-one p { color: var(--color-muted) !important; }
.hero-banner-six .wrapper .box-one .main-count { color: var(--color-cacau) !important; }

/* box-two: branco → creme */
.hero-banner-six .wrapper .box-two { background: var(--color-creme) !important; border: 1px solid var(--color-areia) !important; }
.hero-banner-six .wrapper .box-two .main-count { color: var(--color-cacau) !important; }
.hero-banner-six .wrapper .box-two p { color: var(--color-muted) !important; }

/* box-three: rosa choque → azul claro */
.hero-banner-six .wrapper .box-three { background: var(--color-azul) !important; }
.hero-banner-six .wrapper .box-three blockquote { color: var(--color-cacau) !important; }
.hero-banner-six .wrapper .box-three .name { color: var(--color-cacau) !important; }
.hero-banner-six .wrapper .box-three .name span { color: var(--color-muted) !important; }

/* box-four: preto → cacau, texto branco */
.hero-banner-six .wrapper .box-four { background: var(--color-cacau) !important; }
.hero-banner-six .wrapper .box-four .main-count { color: #fff !important; }
.hero-banner-six .wrapper .box-four p { color: #fff !important; }
.hero-banner-six .wrapper .box-four li { color: var(--color-cacau) !important; }

/* CTAs */
.btn-fourteen,
.signup-btn-one,
.btn-nineteen,
.talk-btn,
.theme-btn-one,
.theme-btn-two { background-color: var(--color-terra) !important; border-color: var(--color-terra) !important; color: #fff !important; }
.btn-fourteen:hover,.signup-btn-one:hover,.btn-nineteen:hover,.talk-btn:hover { background-color: var(--color-cacau) !important; border-color: var(--color-cacau) !important; }

/* Fundos de seção */
.bg-grey, .bg-light-grey { background-color: var(--color-areia) !important; }
.fancy-short-banner-thirteen, .counter-section-two { background-color: var(--color-sage) !important; }
.fancy-short-banner-twelve, .fancy-short-banner-fourteen { background-color: var(--color-areia) !important; }

/* Footer */
.footer-one { background-color: var(--color-cacau) !important; color: var(--color-creme) !important; }
.footer-one a, .footer-one p, .footer-one li { color: var(--color-light) !important; }
.footer-one a:hover { color: var(--color-terra) !important; }
.footer-one .tel { color: var(--color-terra) !important; }
.footer-one h3 span { color: var(--color-terra) !important; }
.footer-one h3 { color: #fff !important; }
.footer-one .copyright-text { color: var(--color-light) !important; }
.footer-one .copyright-text span { color: #fff !important; }

/* Accents */
.color-two, h1 span, h2 span { color: var(--color-terra) !important; }
p { color: var(--color-muted) !important; }
h1, h2, h3, h4, h5, h6 { color: var(--color-cacau) !important; }

/* Cards */
.card, .blog-meta-three, .feedback-card-two { background-color: var(--color-creme) !important; border-color: var(--color-areia) !important; }
.feedback-card-two h3 { color: var(--color-cacau) !important; }
.feedback-card-two blockquote { color: var(--color-muted) !important; }

/* Sidebar */
.sidebar-container { background-color: var(--color-creme) !important; }

/* Preloader */
#preloader { background-color: var(--color-creme) !important; }
.letters-loading { color: var(--color-cacau) !important; }
.letters-loading::before { color: var(--color-terra) !important; }

/* Links */
a { color: var(--color-terra) !important; }
a:hover { color: var(--color-cacau) !important; }
.navbar a, .footer-one a { color: inherit !important; }

/* Dark mode switcher — esconder o botão lua */
#switcher { display: none !important; }

/* ============================================
   RESPONSIVIDADE MOBILE — IMAGENS
   ============================================ */

/* Garantir que todas as imagens sejam responsivas */
img {
  max-width: 100%;
  height: auto;
}

/* Bloco Sobre nós — col-4/col-8 em mobile empilha normalmente */
.block-feature-fourteen .img-meta {
  width: 100%;
  height: auto;
  border-radius: 15px;
}

/* Project-img (background-image) — precisa de altura mínima em mobile */
@media (max-width: 991px) {
  .project-block-one .project-img {
    min-height: 250px;
    border-radius: 20px;
    margin-bottom: 20px;
  }
  .project-block-one .order-lg-last {
    order: 0 !important;
  }
}

/* Hero banner wrapper — imagens do hero não quebram em mobile */
.hero-banner-six .wrapper .row-wrapper {
  overflow: hidden;
}
.hero-banner-six .wrapper .col-wrapper .inner-content img {
  max-width: 100%;
  height: auto;
}

/* Feedback cards — sem foto lateral em mobile */
@media (max-width: 575px) {
  .feedback-card-two .cf-img {
    display: none;
  }
}

/* Imagens gerais dentro de colunas */
@media (max-width: 767px) {
  .col-12 img,
  .col-sm-12 img {
    width: 100%;
    height: auto;
  }
}

/* Blog cards — imagens responsivas sem distorção */
.blog-meta-two .media img {
  width: 100%;
  height: auto !important;
  aspect-ratio: 3/2;
  object-fit: cover;
  border-radius: 20px;
}

/* Garantia geral: nenhum img com height fixo via atributo distorce */
img.w-100 {
  height: auto !important;
}
