/* =========================================================
   APLICAÇÕES — CENTERED / PALETTE STRICT (WP SAFE)
========================================================= */

#apps-list{
  all:initial;
  display:block;

  /* PALETTE */
  --brand: #12b3b6;
  --brand-soft: #e6f6f7;
  --accent: #f5c84c;

  --bg: #f6f8fa;
  --panel: #ffffff;
  --ink: #0f172a;
  --muted: #5b6570;
  --line: #e2e8f0;

  --radius: 20px;
  --radius-sm: 10px;
  --shadow: 0 10px 28px rgba(0, 0, 0, 0.08);

  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Arial,sans-serif;
  color:var(--ink);
}

/* =========================================================
   LAYOUT
========================================================= */

#apps-list{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0;
}

/* SECTIONS */

#apps-list section{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
}

/* TÍTULOS DE SECÇÃO */

#apps-list .ap-section-title{
  text-align:center;
  margin:30px 0 10px;
  color:var(--brand);
  font-weight:500;
  font-size:20px;
  letter-spacing:.2px;
}

/* =========================================================
   ITEM
========================================================= */

#apps-list .ap-item{
  width:100%;
  max-width:1000px;
  padding:22px 18px;
  text-align:center;

  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  margin-bottom:14px;

  transition:background .2s ease, border-color .2s ease, transform .12s ease;
}

/* HOVER */

#apps-list .ap-item:hover{
  background:var(--brand-soft);
  border-color:var(--brand);
  transform:translateY(-2px);
}

/* =========================================================
   TÍTULO
========================================================= */

#apps-list .ap-item h3{
  all:unset;
  display:block;
  margin:0 0 8px;

  font-size:22px;
  font-weight:500;
  line-height:1.3;
  color:var(--ink);
}

/* LINK */

#apps-list .ap-item h3 a{
  all:unset;
  cursor:pointer;
  color:var(--ink);
}

#apps-list .ap-item h3 a:hover{
  color:var(--brand);
}

/* =========================================================
   EXCERTO
========================================================= */

#apps-list .ap-excerpt{
  all:unset;
  display:block;

  max-width:900px;
  margin:0 auto;

  font-size:clamp(15px, 1.05vw, 16.5px);
  line-height:1.62;
  color:var(--muted);
}

/* =========================================================
   ESTADOS (SEM INLINE STYLE)
========================================================= */

#apps-list .ap-empty{
  text-align:center;
  color:var(--muted);
  font-size:15px;
  margin:20px 0;
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width:640px){

  #apps-list .ap-item{
    padding:18px 14px;
  }

  #apps-list .ap-item h3{
    font-size:20px;
  }

  #apps-list .ap-section-title{
    font-size:18px;
    margin:24px 0 8px;
  }
	  }