/* ==========================================================================
   main.css - Estilos Globais e Layout Principal
   ========================================================================== */

/* 0. Reset Básico - Remove margens e ajusta box-sizing */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* 1. Variáveis (Root) - Definição de cores e fontes */
:root {
    --primary-color: #F0F0F0;
    --secondary-color: #274046;
    --tertiary-color:#537EBE;
    --success: #32534F;
    --info:#6498dc;
    --background-color: #F4F4F4;
    --text-color:#2b2b2b;
    --font-main: "Ubuntu", sans-serif;
    --font-weight: 400;
    --font-style: normal;
    color-scheme: light dark;      }

/* 2. Defina o tema escuro usando a media query */
@media (prefers-color-scheme: dark) {
  :root {
    --background-color: var(--secondary-color);
    --success: #70B2AA;
    --text-color: var(--primary-color);
  }
}

/* 3. Media Queries - Responsividade */
@media (max-width: 768px) {
  .container {
    width: 95%;
  }
}

body {
  font-family: var(--font-main);
  background-color: var(--background-color);
  color: var(--text-color);
  line-height: 1.6;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
}
h1{
  color: var(--success);
}
.info{
  color:var(--info)
}
.block_name{
  display: flex;
  justify-content: center;
  border-bottom: 1px solid var(--primary-color);
  width: 90vw;
}