:root {
  --bg-primary: #12181F; /* Deep Dark Blue/Gray */
  --bg-secondary: #1A222C; /* Darker Blue/Gray for elements */
  --text-primary: #E6EDF3; /* Light Gray/Off-White */
  --text-secondary: #7D8B99; /* Softer Gray */
  --accent-primary: #2b7a8f; /* Azul Petróleo - Brandbook */
  --accent-secondary: #ffa500; /* Laranja Ação - Brandbook */
  --accent-success: #4caf50; /* Verde Sucesso - Brandbook */
  --accent-hover: #1f5f73; /* Azul Petróleo Escuro */
  --border-color: #30363D; /* Subtle Dark Border */
}

body {
  font-family: 'Roboto', sans-serif;
  color: var(--text-primary);
  background-color: var(--bg-primary);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
  color: var(--text-primary);
}

.font-montserrat {
  font-family: 'Montserrat', sans-serif;
}

.font-roboto {
  font-family: 'Roboto', sans-serif;
}

.text-gradient-accent {
  background: linear-gradient(to right, var(--accent-primary), var(--accent-hover));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.bg-grid-pattern {
  background-image: 
    linear-gradient(to right, var(--border-color) 1px, transparent 1px),
    linear-gradient(to bottom, var(--border-color) 1px, transparent 1px);
  background-size: 40px 40px;
}