/*
Theme Name:   Mattos & Mattos Advogados
Theme URI:    https://mattosemattosadvogados.com.br
Description:  Tema filho do Hello Elementor para Mattos & Mattos Advogados Associados
Author:       Heron Mattos
Author URI:   https://mattosemattosadvogados.com.br
Template:     hello-elementor
Version:      1.0.0
Text Domain:  mattos-child
*/

/* ═══════════════════════════════════════════════════════
   VARIÁVEIS GLOBAIS — MATTOS & MATTOS
═══════════════════════════════════════════════════════ */
:root {
  --mm-azul-escuro:   #0d1e3a;
  --mm-azul-medio:    #142444;
  --mm-azul-royal:    #1a2d55;
  --mm-ouro:          #c9a84c;
  --mm-ouro-claro:    #e0bf78;
  --mm-ouro-suave:    #f0d99a;
  --mm-prata:         #c8cfd8;
  --mm-prata-claro:   #e8ecf0;
  --mm-cinza-corpo:   #a0aab8;
  --mm-branco:        #f5f6f8;
  --mm-preto:         #07111f;
  --mm-font-display:  'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --mm-font-body:     'Roboto', system-ui, sans-serif;
}

/* ═══════════════════════════════════════════════════════
   RESET & BASE
═══════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  font-size: 17px;
}

body {
  font-family: var(--mm-font-body) !important;
  font-size: 1rem !important;
  font-weight: 300 !important;
  line-height: 1.78 !important;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* ═══════════════════════════════════════════════════════
   TIPOGRAFIA
═══════════════════════════════════════════════════════ */
h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
  font-family: var(--mm-font-display) !important;
  line-height: 1.08 !important;
}

p,
.elementor-widget-text-editor p,
.elementor-text-editor p {
  font-size: 1rem !important;
  line-height: 1.8 !important;
  color: var(--mm-cinza-corpo);
}

/* Textos descritivos de cards, seções */
.elementor-icon-box-description,
.elementor-widget-text-editor *:not(h1):not(h2):not(h3):not(h4):not(strong) {
  font-size: 1rem !important;
  line-height: 1.8 !important;
}

/* Labels tipo "RIO DE JANEIRO · BRASÍLIA · DESDE 2001" */
.elementor-heading-title[style*="font-size: 12px"],
.elementor-heading-title[style*="font-size: 13px"],
.elementor-heading-title[style*="font-size: 14px"] {
  font-size: 0.82rem !important;
  letter-spacing: 0.18em !important;
}

/* Títulos das seções H2 */
.elementor-heading-title.elementor-size-xl,
.elementor-heading-title.elementor-size-xxl {
  font-size: clamp(2.2rem, 3.8vw, 3.5rem) !important;
}

/* Títulos cards H3 */
.elementor-icon-box-title,
.elementor-icon-box-title * {
  font-size: 1.18rem !important;
}

/* ═══════════════════════════════════════════════════════
   HELLO ELEMENTOR OVERRIDES
═══════════════════════════════════════════════════════ */
.elementor-section,
.e-con {
  --section-padding: 0;
}

.site-header,
.page-header { display: none !important; }

/* ═══════════════════════════════════════════════════════
   HERO — TELA CHEIA, FOTO GRANDE (estilo RB Gestão)
═══════════════════════════════════════════════════════ */

/* Seção hero: 100vh, grid 50/50 */
.elementor-location-single > .elementor-section-wrap > .elementor-section:first-child,
.elementor-location-single > .e-con:first-child,
body:not(.elementor-editor-active) section.elementor-section:first-of-type {
  min-height: 100vh !important;
}

/* Container interno */
.elementor-location-single > .elementor-section-wrap > .elementor-section:first-child > .elementor-container,
body:not(.elementor-editor-active) section.elementor-section:first-of-type > .elementor-container {
  min-height: 100vh !important;
  align-items: stretch !important;
  padding: 0 !important;
}

/* Coluna de texto (esquerda) — alinha verticalmente ao centro */
body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:first-child .elementor-widget-wrap {
  justify-content: center !important;
  padding: 7rem 5% 5rem 7% !important;
  min-height: 100vh;
}

/* Coluna da foto (direita) — sem padding, foto cobre tudo */
body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child {
  padding: 0 !important;
}

body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child .elementor-widget-wrap {
  padding: 0 !important;
  height: 100%;
}

body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child .elementor-widget-image {
  height: 100%;
  display: flex;
  flex-direction: column;
}

body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child .elementor-widget-image figure,
body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child .elementor-widget-image a {
  flex: 1;
  height: 100%;
  display: block;
  margin: 0 !important;
  padding: 0 !important;
}

/* A foto em si: cobre toda a coluna */
body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child img {
  width: 100% !important;
  height: 100vh !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center top !important;
  display: block !important;
  border-radius: 0 !important;
}

/* Gradiente sutil à esquerda da foto (faz transição suave com o texto) */
body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 120px; height: 100%;
  background: linear-gradient(to right, var(--mm-azul-escuro, #0d1e3a) 0%, transparent 100%);
  z-index: 1;
  pointer-events: none;
}

/* ═══════════════════════════════════════════════════════
   MENU DE NAVEGAÇÃO
═══════════════════════════════════════════════════════ */
.elementor-nav-menu .elementor-item,
.elementor-nav-menu a {
  font-size: 0.82rem !important;
  letter-spacing: 0.1em !important;
  font-weight: 400 !important;
}

/* ═══════════════════════════════════════════════════════
   BOTÕES
═══════════════════════════════════════════════════════ */
.elementor-button,
a.elementor-button {
  font-size: 0.82rem !important;
  letter-spacing: 0.12em !important;
  padding: 14px 28px !important;
  font-weight: 400 !important;
}

/* ═══════════════════════════════════════════════════════
   SCROLL REVEAL (mesmo sistema da RB)
═══════════════════════════════════════════════════════ */
.mm-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.mm-reveal.mm-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ═══════════════════════════════════════════════════════
   RESPONSIVO — MOBILE
═══════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  /* Hero: empilha coluna da foto abaixo do texto */
  body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child img {
    height: 55vw !important;
  }

  body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:first-child .elementor-widget-wrap {
    padding: 5rem 6% 3rem !important;
    min-height: unset;
  }

  body:not(.elementor-editor-active) section.elementor-section:first-of-type > .elementor-container {
    min-height: unset !important;
  }
}

@media (max-width: 768px) {
  html { font-size: 16px; }

  body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:last-child img {
    height: 65vw !important;
  }

  body:not(.elementor-editor-active) section.elementor-section:first-of-type .elementor-column:first-child .elementor-widget-wrap {
    padding: 4rem 5% 2.5rem !important;
  }

  .elementor-heading-title.elementor-size-xl,
  .elementor-heading-title.elementor-size-xxl {
    font-size: clamp(1.9rem, 8vw, 2.8rem) !important;
  }
}

/* ═══════════════════════════════════════════════════════
   HERO — CORREÇÃO ESPECÍFICA (seletor real do site)
   section#inicio.hero > div.hero-right > img.hero-chess-photo
═══════════════════════════════════════════════════════ */

/* Seção hero ocupa tela toda */
section#inicio.hero {
  min-height: 100vh !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: stretch !important;
  overflow: hidden !important;
}

/* Coluna da foto — sem padding, stretch total */
section#inicio.hero .hero-right {
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

/* A foto em si: cobre toda a coluna */
section#inicio.hero .hero-right img.hero-chess-photo,
section#inicio.hero .hero-right img {
  width: 100% !important;
  height: 100vh !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

/* Coluna de texto — centralizada verticalmente */
section#inicio.hero .hero-left,
section#inicio.hero > div:first-child {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 7rem 6% 5rem 7% !important;
  min-height: 100vh !important;
}

/* Gradiente suave na borda esquerda da foto */
section#inicio.hero .hero-right::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  width: 80px !important; height: 100% !important;
  background: linear-gradient(to right, #0d1e3a 0%, transparent 100%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* ── RESPONSIVO ── */
@media (max-width: 1024px) {
  section#inicio.hero {
    grid-template-columns: 1fr !important;
    min-height: unset !important;
  }
  section#inicio.hero .hero-right img.hero-chess-photo,
  section#inicio.hero .hero-right img {
    height: 60vw !important;
  }
  section#inicio.hero .hero-left,
  section#inicio.hero > div:first-child {
    min-height: unset !important;
    padding: 5rem 6% 3rem !important;
  }
}