:root {
    --ad-menu-size: 360px;
    --dg-color-primary: #5662f6;
    --dg-color-secondary: #545454;
    --dg-bg-soft: #f7f8ff;              /* fundo suave para ícones */
    --dg-shadow: 0 8px 24px rgba(0,0,0,.06);
}

/* Site */
  .dg-color-primary {
    color: var(--dg-color-primary);
  }
  .dg-color-secondary {
    color: var(--dg-color-secondary);
  }

  .logo-img {
    width: 200px;
    height: auto;
    display: block;
  }

  .navbar .nav-link {
    position: relative;
    transition: color 0.3s ease;
  }

  .navbar .nav-link:hover {
    color: var(--dg-color-primary) !important;
  }

  .navbar .nav-link::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--dg-color-primary);
    transition: width 0.3s ease;
  }

  .navbar .nav-link:hover::after {
    width: 100%;
  }

  /* home */

  .hero-title {
    font-family: "Rubik", sans-serif;
    font-style: normal;
    font-size: clamp(2rem, 4.5vw + 0.5rem, 3.5rem);
    line-height: 1.1;
    letter-spacing: -0.5px;
  }

  .hero-illustration { width: 100%; height: auto; }
  @media (min-width: 992px) { /* lg+ */
    .hero-illustration { max-width: 520px; } /* ajuste aqui */
  }

  @media (min-width: 992px) {
    .py-lg-6 {
      padding-top: 5rem !important;
      padding-bottom: 5rem !important;
    }
  }

  .dg-btn-primary {
    background-color: var(--dg-color-primary);
    border-color: var(--dg-color-primary);
    color: #fff;
  }

  .dg-btn-primary:hover {
    background-color: #4551d4; /* tom mais escuro no hover */
    border-color: #4551d4;
    color: #fff;
  }

  .dg-btn-outline-primary {
    color: var(--dg-color-primary);
    border-color: var(--dg-color-primary);
  }

  .dg-btn-outline-primary:hover {
    background-color: var(--dg-color-primary);
    color: #fff;
    border-color: var(--dg-color-primary);
  }

  .dg-a {
    text-decoration: none;
    color: var(--dg-color-secondary);
  }

  /* home */
  /* título com underline*/
  .about-title{
    position: relative;
    display: inline-block;
    letter-spacing: -0.3px;
  }
  .about-title::after{
    content:"";
    display:block;
    height:4px;
    width:64%;
    margin:10px auto 0;
    border-radius:999px;
    background: var(--dg-color-primary);
  }

  /* intro */
  .about-intro {
    text-align: justify;
    color: var(--dg-color-secondary);
    font-size: 1.15rem; /* ou 1.25rem pra ainda maior */
    line-height: 1.8;   /* melhora a leitura */
  }

  /* cards “clean” (sem borda pesada) com micro hover */
  .about-item{
    background: #fff;
    border-radius: 16px;
    padding: 24px 22px;
    box-shadow: var(--dg-shadow);
    transition: transform .25s ease, box-shadow .25s ease;
  }
  .about-item:hover{
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0,0,0,.09);
  }

  /* ícone em pílula com gradiente */
  .about-icon{
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    margin-bottom: 12px;
    background:
      radial-gradient(120% 120% at 0% 0%, rgba(86,98,246,.25), rgba(86,98,246,0) 70%),
      var(--dg-bg-soft);
    color: var(--dg-color-primary);
    font-size: 1.25rem;
  }

  /* textos */
  .text-secondary-600{ color: var(--dg-color-secondary) !important; }

  /* lista de valores com bullets personalizados */
  .about-list{
    list-style: none;
    padding-left: 0;
    color: var(--dg-color-secondary);
  }
  .about-list li{
    position: relative;
    padding-left: 1.25rem;
    margin-bottom: .35rem;
  }
  .about-list li::before{
    content:"";
    position:absolute;
    left:0; top:.55rem;
    width:8px; height:8px; border-radius:50%;
    background: var(--dg-color-primary);
    box-shadow: 0 0 0 3px rgba(86,98,246,.15);
  }
  .about-list span{ color:#1f2330; font-weight:600; }

  /* espaçamento maior em telas grandes */
  @media (min-width: 992px){
    .py-lg-6{ padding-top:5rem !important; padding-bottom:5rem !important; }
  }

  /* Portifolio */
  
  .badge-tech { font-size: .75rem; background: #f1f3f5; color: #444; border: 1px solid #e5e7eb; }

  /* Site */


  /* Sistema */

  /* Centralizar contúdo nos grids*/
  .tbody, td, tfoot, th, thead, tr {
    vertical-align: middle !important;
  };

