/* Definição de Paleta de Cores (Variáveis CSS) */
    :root {
      --bg-principal: #f4f6f9;
      --bg-cards: #ffffff;
      --bg-section-alt: #fdfdfd;
      --texto-principal: #333333;
      --texto-secundario: #555555;
      --texto-suave: #666666;
      --azul-escuro: #0f2354;
      --azul-medio: #1f3c88;
      --azul-claro: #3a6edb;
      --laranja: #ff9800;
      --borda-card: #eef2f5;
    }

    [data-theme="dark"] {
      --bg-principal: #121214;
      --bg-cards: #1a1a1e;
      --bg-section-alt: #161619;
      --texto-principal: #e1e1e6;
      --texto-secundario: #c4c4cc;
      --texto-suave: #8d8d99;
      --azul-escuro: #091124;
      --azul-medio: #294eb3;
      --azul-claro: #5280e2;
      --laranja: #ffb13d;
      --borda-card: #29292e;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
    }
    body {
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      background-color: var(--bg-principal);
      color: var(--texto-principal);
      line-height: 1.6;
    }
    
    header {
      background: linear-gradient(135deg, var(--azul-escuro), var(--azul-medio));
      color: white;
      padding: 30px 20px;
      text-align: center;
      box-shadow: 0 4px 15px rgba(0,0,0,0.15);
    }
    header h1 { font-size: 3.5em; letter-spacing: 1px; margin-bottom: 10px; }
    header p { font-size: 1.3em; opacity: 0.9; max-width: 700px; margin: 15px auto 0 auto; }

    section { padding: 60px 20px; max-width: 1100px; margin: auto; }
    h2 { color: var(--azul-medio); margin-bottom: 30px; font-size: 2.2em; text-align: center; position: relative; }
    [data-theme="dark"] h2 { color: var(--azul-claro); }
    h2::after { content: ''; display: block; width: 50px; height: 4px; background-color: var(--laranja); margin: 10px auto 0 auto; border-radius: 2px; }

    .about-text { font-size: 1.2em; text-align: center; max-width: 800px; margin: 0 auto; color: var(--texto-secundario); }

    .services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; margin-top: 20px; }
    .service-item { background: var(--bg-cards); padding: 25px; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.05); border-top: 4px solid var(--azul-medio); text-align: center; }
    .service-item i { font-size: 2em; color: var(--azul-claro); margin-bottom: 15px; }
    .service-item p { font-size: 1.05em; font-weight: 500; }

    .team-grid { display: flex; gap: 30px; flex-wrap: wrap; justify-content: center; }
    .team-card { background: var(--bg-cards); border-radius: 12px; box-shadow: 0 6px 15px rgba(0,0,0,0.08); padding: 30px; flex: 1 1 350px; max-width: 450px; text-align: center; border: 1px solid var(--borda-card); }
    .team-card .avatar { width: 90px; height: 90px; background-color: var(--bg-principal); color: var(--azul-medio); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 2.5em; margin: 0 auto 20px auto; }
    [data-theme="dark"] .team-card .avatar { color: var(--azul-claro); }
    .team-card h3 { color: var(--azul-medio); font-size: 1.4em; margin-bottom: 5px; }
    [data-theme="dark"] .team-card h3 { color: var(--azul-claro); }
    .team-card .role { color: var(--laranja); font-weight: bold; font-size: 0.95em; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 15px; }
    .team-card p { color: var(--texto-suave); font-size: 1em; margin-bottom: 25px; }
    
    /* Container para organizar os botões lado a lado */
    .team-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
    .btn-profile, .btn-cv { display: inline-block; padding: 10px 18px; border-radius: 20px; text-decoration: none; font-weight: bold; font-size: 0.85em; transition: background 0.3s, transform 0.2s; }
    
    .btn-profile { background-color: var(--azul-medio); color: white; }
    .btn-profile:hover { background-color: var(--azul-claro); transform: translateY(-2px); }
    
    .btn-cv { background-color: transparent; color: var(--texto-principal); border: 2px solid var(--azul-medio); }
    .btn-cv:hover { background-color: var(--laranja); border-color: var(--laranja); color: #121214; transform: translateY(-2px); }

    .portfolio-grid { display: flex; gap: 25px; flex-wrap: wrap; }
    .portfolio-card { background: var(--bg-cards); border-radius: 10px; box-shadow: 0 4px 12px rgba(0,0,0,0.08); padding: 25px; flex: 1 1 300px; text-decoration: none; color: inherit; transition: transform 0.3s, box-shadow 0.3s; border-left: 5px solid var(--azul-claro); }
    .portfolio-card:hover { transform: translateY(-5px); box-shadow: 0 8px 20px rgba(0,0,0,0.15); }
    .portfolio-card h3 { color: var(--azul-medio); margin-bottom: 10px; font-size: 1.25em; display: flex; align-items: center; gap: 10px; }
    [data-theme="dark"] .portfolio-card h3 { color: var(--azul-claro); }
    .portfolio-card:hover h3 { color: var(--laranja); }
    .portfolio-card p { color: var(--texto-suave); font-size: 0.95em; }

    footer { background: var(--azul-escuro); color: white; text-align: center; padding: 40px 20px; margin-top: 60px; }
    footer .contact-info { font-size: 1.1em; margin-bottom: 15px; }
    footer a { color: var(--laranja); text-decoration: none; font-weight: bold; margin: 0 10px; transition: color 0.3s; }
    footer a:hover { color: white; text-decoration: underline; }
    footer .copyright { font-size: 0.85em; opacity: 0.7; margin-top: 15px; }

    .theme-toggle-btn { position: fixed; bottom: 25px; right: 25px; background-color: var(--azul-medio); color: white; border: none; width: 50px; height: 50px; border-radius: 50%; cursor: pointer; box-shadow: 0 4px 10px rgba(0,0,0,0.3); display: flex; align-items: center; justify-content: center; font-size: 1.4em; z-index: 999; }
    .theme-toggle-btn:hover { transform: scale(1.1); background-color: var(--laranja); }
    .theme-toggle-btn .fa-sun { display: none; }
    [data-theme="dark"] .theme-toggle-btn .fa-moon { display: none; }
    [data-theme="dark"] .theme-toggle-btn .fa-sun { display: block; }


/* Limita o tamanho máximo do painel para que ele fique pequeno e centralizado */
.powerbi-wrapper-pequeno {
  max-width: 1100px; /* Altere este valor se quiser um pouco maior (ex: 700px) ou menor (ex: 500px) */
  margin: 0 auto;   /* Centraliza o bloco na tela */
}

/* Mantém a proporção de tela elástica e responsiva (16:9) */
.powerbi-responsive-container {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* Proporção ideal para não cortar os gráficos */
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  border: 1px solid var(--borda-card);
}

.powerbi-responsive-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}